javascript - 我可以阻止 AngularJS 完全重建 DOM 的重复部分吗？

Question

给定以下简单模块和 Controller :

var t = angular.module("test", []);
t.controller("TestCtrl", function ($scope, $timeout) {

    $scope.arr = [
        "elem1",
        "elem2",
        "elem3"
    ];

    $scope.getDate = function () {
        return +new Date();
    };

    $timeout(function () {
        $scope.arr[2] = "< I should have a different timestamp to the two above me now";
    }, 2000);
});

以及以下简单模板:

<ul ng-app="test" ng-controller="TestCtrl">
    <li ng-repeat="x in arr">{{getDate()}} {{arr[$index]}}</li>
</ul>

当一个模型的 arr 属性中的单个值发生变化？

我希望能够呈现该列表，以便在超时后修改第三个元素时，前两个元素的时间戳不会改变。

这是 a fiddle包含上面的例子。

编辑:请注意，此示例中的时间戳仅用于演示问题。我的真实代码要复杂得多，并且由于 Angular 每次都重新创建的 DOM 节点数量而遇到性能问题。在这种情况下，将时间戳添加到模型不是解决方案。

Answer 1

一种方法是将时间戳设为模型属性。

这是我做的

http://jsfiddle.net/vx2c3/2/

<ul ng-app="test" ng-controller="TestCtrl">
    <li ng-repeat="x in arr" ng-init="t=getDate()">{{getDate()}} and {{t}} {{arr[$index]}}</li>
</ul>

这基本上是创建一个模型属性t