Question

我了解当我<p>{{abc}}<p>或{{ng-repeat="item in list"}} angularjs为$scope.abc和$scope.list设置观察者时，会检查其值在每个摘要循环中。

但是当我使用带有功能的ng-class指令时，我无法弄清楚角度观看的表达方式

＆＃13;

angular.module("app",[]).controller("control",function($scope){
  var clicked = false;   
  // this is the variable I would watch for and returnString is the call back...
  // but how could angular possibly know??
  $scope.toggle = function(){
    clicked = !clicked;
  }
  $scope.returnString = function(){
    if(clicked){
      return 'text-success';
    }
    return 'text-danger';
  }
});

＆＃13;

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <script data-require="angular.js@1.5.0" data-semver="1.5.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
  </head>

  <body ng-controller="control">
    <button ng-click="toggle()">click</button>
    <h1 ng-class="returnString()">hello world</h1>
    <!--ng-class="clicked?'text-success':'text-danger'" this way angular knows what to watch...but what if I give it a function???-->
  </body>

</html>

＆＃13;

在html中...... angular不知道是什么值＆＃34; returnString（）＆＃34;依靠，框架如何设置观察者？或者只是在每个摘要循环后运行ng-class表达式？？

Answer 1

Log.set(Log.LEVEL_DEBUG)也可以在功能上使用AngularJs。

例如，而不是$watch

你可以这样做

$watch('abc', function() { /* code */});

所以$watch(function() { return $scope.$abc; }, function() { /* code */ });以相同的方式工作：如果你放置一个函数，它会在范围上下文中对函数应用$ watch（这意味着函数需要在当前范围内定义）

请参阅AngularDocs中的$watch文档，了解它如何使用函数进行观察：

ng-class

正在观察的事物是该函数的结果，该函数在每个摘要循环中执行（您可以设置调试断点来验证它）

angularjs如何设置观察者的功能？

1 个答案: