Question

＆＃13;

angular.module('NGTest', [
])
.controller('ItemList', ['$scope', function($scope) {
	console.log("ItemList controller init");
	var self = this;
  self.count = 4;
  self.getItems = function() {
  	console.log("ItemList.getItems() called");
	  return [];
  }
}]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="NGTest">
<div ng-controller="ItemList as lst">
<select ng-options="value for value in [1,2,3,4,5]" ng-model="lst.count"></select>
<div ng-repeat="item in lst.getItems()">foo </div>
</div>
</div>

＆＃13;

通过日志条目，您可以看到在启动时，lst.getItems（）函数被调用两次。为什么两次？

更改lst.count的值时也会调用它，根本不使用它。好吧，我知道AngularJS不是那么聪明，并且看到lst.getItems（）的代码不依赖于lst.count，但我希望默认情况下它假定它没有，我必须提供它在函数参数中。

Answer 1

为什么两次

您需要了解角度消化周期的工作原理。如果这些摘要中的范围发生变化，每个周期将至少运行2个摘要。

在ng-repeat视图中使用函数作为源不是一个好主意。在控制器中获取数据并传递给作为范围数组的视图

self.items= getItems();   

function getItems(){
   console.log("ItemList.getItems() called");
   return [];
}

现在该函数只会被调用一次......当控制器初始化时

查看

<div ng-repeat="item in lst.items">{{item}}</div>

ng-repeat的列表来源调用了太多次

1 个答案: