title: Angular.js binding one property to another
body: <p>As a contrived example, let's say I have an angular controller that looks something like this:</p>
  
  <pre><code>function OverflowController($scope) {
  
    // initialize the count variable
    $scope.count = 0;
  
    // pretend the overflow logic is complex and doesn't belong in a filter or view
    var count = parseInt($scope.count);
  
    if (count &lt; 100) {
      $scope.overflow = "normal";
    }
    else if (count &lt; 200) {
      $scope.overflow = "warning";
    }
    else {
      $scope.overflow = "error";
    }
  
  };
  </code></pre>
  
  <p>and I have a view that looks like this:</p>
  
  <pre><code>&lt;input ng-model="count"&gt;
  &lt;p&gt;Count: {{count}}&lt;/p&gt;
  &lt;p&gt;Overflow? {{overflow}}&lt;/p&gt;
  </code></pre>
  
  <p>How can I bind the overflow property of the scope to the count property in such a way that when the count is updated, the overflow automatically gets updated too?</p>