Question

我有一个小列表，想要为每个列表项执行一个函数。但是这个功能被多次执行，我不知道为什么。

HTML：

  <body  ng-controller="ListCtrl">
    <div>
        <ul ng-repeat="item in items">
          <li>{{item.name}}<img ng-src="{{test()}}"></li>
        </ul>
        {{counter}}
    </div>
  </body>

角：

$scope.items = [
{name: 'foo', },
{name: 'bar', },
{name: 'baz', }
];
var counter= 0;
$scope.test= function(){
$scope.counter=counter++;
console.log("Executed");
}

为什么函数文本多次执行？另请参阅此示例：http://plnkr.co/edit/kxJZHCmFs4POd3SVtGZ8

Answer 1

这是预期的行为。每当在html模板中满足插值表达式{{}}时，就会创建一个监视该表达式中的更改的监视。在$digest周期内，表达式可以被评估数十次切勿在插值表达式中使用函数调用。仅限$scope中定义的引用属性。在你的情况下，它应该像

$scope.testValue = $scope.test();

{{testValue}}

ng-src中的函数多次执行

1 个答案: