javascript - Angular.js 将一个属性绑定(bind)到另一个

Question

作为一个人为的例子，假设我有一个看起来像这样的 Angular Controller :

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 < 100) {
    $scope.overflow = "normal";
  }
  else if (count < 200) {
    $scope.overflow = "warning";
  }
  else {
    $scope.overflow = "error";
  }

};

我有一个看起来像这样的 View :

<input ng-model="count">
<p>Count: {{count}}</p>
<p>Overflow? {{overflow}}</p>

如何将范围的溢出属性绑定(bind)到计数属性，以便在更新计数时溢出也自动更新？

Answer 1

使用 $watch: ( http://docs.angularjs.org/api/ng.$rootScope.Scope#$watch )

function OverflowController($scope) {

  // initialize the count variable
  $scope.count = 0;

  $scope.$watch('count', function (count) {
     // pretend the overflow logic is complex and doesn't belong in a filter or view

     if (count < 100) {
       $scope.overflow = "normal";
     }
     else if (count < 200) {
       $scope.overflow = "warning";
     }
     else {
       $scope.overflow = "error";
     }
   });
};