Javascript angularjs ngRepeat指令不触发列表中其他项的摘要
似乎ngRepeat会在更改其中一个列表项后触发任何列表项上的手表。我已经在使用track by了,所以这似乎没有什么帮助 这是我的模板:Javascript angularjs ngRepeat指令不触发列表中其他项的摘要,javascript,angularjs,angularjs-directive,Javascript,Angularjs,Angularjs Directive,似乎ngRepeat会在更改其中一个列表项后触发任何列表项上的手表。我已经在使用track by了,所以这似乎没有什么帮助 这是我的模板: div(ng-repeat="poll in polls track by poll._id") poll(poll="poll") .poll .title(ng-if="!poll.closed") {{poll.title}} .btn(ng-click="poll.closed = true") Change poll {{some
div(ng-repeat="poll in polls track by poll._id")
poll(poll="poll")
.poll
.title(ng-if="!poll.closed") {{poll.title}}
.btn(ng-click="poll.closed = true") Change poll
{{someExpensiveComputation(poll._id)}}
javascript:
.directive('poll', function($rootScope, $modal) {
return {
replace: false,
restrict: 'E',
scope: {
poll: '='
},
templateUrl: '/tmpl/poll',
link: function($scope, elem, attrs) {
$scope.someExpensiveComputation = function (id) { ... }
}
}
});
似乎每次更改轮询项时,someExpensiveComputation函数都会为所有轮询运行,每次运行3次。我怎么才能让它不那么做呢?它应该只触发该指令的观察者。我认为这应该是可能的
谢谢。所有的-表达式在每个$digest循环中被处理(计算)多次。因此,保持-表达式尽可能简单(就计算复杂性而言)是一种很好的做法 (顺便说一句,在视图中使用
{{…}
会创建一个)
如果someExpensiveComputation()
在计算上非常昂贵,那么您不希望每次都对其进行计算,而只希望在它可能产生不同结果时进行计算。它取决于函数的实现,但假设其结果仅依赖于每个轮询的属性,则您可以轮询并在更改时调用昂贵的函数:
.poll
...
{{expensivelyComputedValue}}
.directive('poll', function($rootScope, $modal) {
return {
...
link: function(scope, elem, attrs) {
function someExpensiveComputation(id) { ... }
scope.expensivelyComputedValue = someExpensiveComputation(scope.poll.id);
scope.$watch('poll', function (newValue, oldValue) {
if (newValue === oldValue) { return; }
scope.expensivelyComputedValue = someExpensiveComputation(scope.poll.id);
}, true);
}
}
});
当然,如果昂贵计算的结果仅取决于poll的特定属性(而不是整个对象),则只需此属性即可,从而使-表达式更加“轻量级”。例如:
投票结果如何变化?谁换的?@ExpertSystem嗨,谢谢。我用一个民意测验编辑的例子编辑了这个问题。谢谢,没有办法通过使用模板而不是在控制器中手动观察来获得这种行为吗?一个对更高范围的变化没有反应的本地观察家?我恐怕没有这样的机会。如果您确信数据只会在按下按钮时更改,则可以将对
someExpensiveComputation()
的调用合并到按钮click-handler.Wow!反对票投给谁?我附带的评论呢?
scope.$watch('poll.closed', function (...) {...});