使用一次性绑定进行ng-repeat - 然后跟踪会对性能产生影响吗?

时间:2017-11-13 07:24:44

标签: javascript angularjs performance angularjs-ng-repeat

正如我在这里阅读(performance of $interpolate vs ng-repeat and one time binding)具有指令ng-repeat并且使用一次性绑定在性能方面几乎相同。如果这不对,请纠正我!

这意味着,在ng-repeat上使用一次性绑定时,属性track by不会添加任何值,对吗?或者它在性能方面实际上对我有帮助,因为ng-repeat否则仍会在$$hashKey生成索引?

1 个答案:

答案 0 :(得分:1)

  

这意味着,当在ng-repeat上使用一次性绑定时,属性跟踪不会添加任何值,对吧?

date month year type expenditure details [1,] "10/31/2017" "Oct" "2017" "food" "10.89" "10.89 Point Of Sale Withdrawal 17203473997 TRESIDDER U2 STANFORD CAUS" [2,] "10/31/2017" "Oct" "2017" "uber" "4.80" "4.80 Point Of Sale Withdrawal 44519795098 UBER TRIP F73MU HELP.UBER.COMCAUS" [3,] "10/31/2017" "Oct" "2017" "instacart" "99.00" "99.00 Point Of Sale Withdrawal 44534891998 INSTACART SUBSCRIPTION HTTPSINSTACARCAUS" [4,] "10/31/2017" "Oct" "2017" "food" "8.45" "8.45 Point Of Sale Withdrawal 22607113998 CLARK CENTER-BIO-X CAF STANFORD CAUS" [5,] "10/31/2017" "Oct" "2017" "food" "4.00" "4.00 Point Of Sale Withdrawal 33426639883 COUPA CAFE Y2E2 STANFORD CAUS" [6,] "10/31/2017" "Oct" "2017" "uber" "4.52" "4.52 Point Of Sale Withdrawal 42029000200217 UBER TRIP QZ7W5 HELP.UB800-5928996 CAUS" [7,] "10/30/2017" "Oct" "2017" "food" "5.85" "5.85 Point Of Sale Withdrawal 44519950998 UBER TRIP HOOMP HELP.UBER.COMCAUS" [8,] "10/30/2017" "Oct" "2017" "uber" "23.20" "23.20 Point Of Sale Withdrawal 33428390882 COUPA CAFE LYTTON PALO ALTO CAUS" [9,] "10/30/2017" "Oct" "2017" "food" "7.52" "7.52 Point Of Sale Withdrawal 34530890882 PANDA EXPRESS #2035 STANFORD CAUS" 和一次性绑定之间没有相关性。

  • 一次性绑定减少了观察者数量
  • 一旦您的列表从服务器更新后,
  • track by不会重新呈现DOM,并且它们没有变化(假设基于项目的track by

id a.e中的一次性绑定ng-repeat一旦稳定就会停止重新计算ng-repeat="friend in ::friends",这在第一个摘要周期后发生(如果表达式结果是非未定义的值)。

例如:

friends

<li ng-repeat="friend in ::friends ">{{friend.name}}</li>

结果:

您将看到$scope.friends = [{ id: 0, name: 'Ben' }]; $timeout(function(){ $scope.friends.push({ id: 3, name: 'Chen' }); },1000); 但是在1秒延迟后没有变化,因为一次性绑定停止了Ben观察者。我们通常将它用于固定列表。

Demo 1

顺便说一句,它适用于列表项计数而不是项目本身。

一次性绑定不会消除ng-repeat

但你可以写:

$$hashKey

Demo 2