title: How does angular resolve infinite recursion?
body: <p>I am following this Udemy course:
  <a href="https://www.udemy.com/the-complete-guide-to-angular-2/" rel="nofollow noreferrer">https://www.udemy.com/the-complete-guide-to-angular-2/</a></p>
  
  <p>I'm on part 2.13 on String Interpolation.</p>
  
  <p>As part of the lesson, you define a simple function in your component to display one of the properties of your class:</p>
  
  <pre><code>export class ServerComponent{
      serverId = 10;
      serverStatus = 'offline';
  
      getServerStatus(){
          return this.serverStatus;
      }
  }
  </code></pre>
  
  <p>Then in your component HTML, you bind that function to the template:</p>
  
  <pre><code>&lt;P&gt;Server with ID {{ serverId }} is {{ getServerStatus() }}&lt;/P&gt;
  </code></pre>
  
  <p>What I wanted to test, is what happens when you bind that string interpolation tag to a function that is self referential... For example:</p>
  
  <pre><code>getServerStatus(){
      this.serverStatus = this.serverStatus + this.serverStatus;
      return this.serverStatus;
  }
  </code></pre>
  
  <p>When I run this code, I notice that the page displays the following:</p>
  
  <pre><code>server with ID 10 is offlineofflineofflineofflineofflineofflineofflineoffline
  </code></pre>
  
  <p>With exactly 8 repetitions of the serverStatus variable.</p>
  
  <p>What I am wondering is why is this amount exactly 8 repetitions? What logic does angular use to decide that the 'real time' template directive gets cut off from the class property after 8 repetitions.</p>