3

给定以下简单的模块和控制器：

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>

当模型属性中的单个值发生变化时，有没有一种方法可以使ng-repeat指令仅更新 DOM 中的必要元素，而不是重建整个元素集？liarr

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

这是一个包含上述示例的小提琴。

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

4

2 回答 2

1

One way to do it would be to make timestamp a model property.

Here is what i did

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>

That is basically create a model property t

于 2013-05-20T15:01:20.833 回答
0

如果您在观察者中包含一个表达式（表达式只不过是一个观察者），每次调用它都会{{curly-brace}}返回一个不同的值（大括号观察者用户严格相等 ( ) 以检测更改），您将始终看到它们更新。===

如果你想解决这个问题，你必须在观察者表达式之外重新计算这些表达式，作为对一些更有意义的事件的响应。

以您getDate()为例，您必须以某种方式将它们包含在您的模型中。例如，您可以有一个单独的数组来存储原始数组的每个索引的日期并同时更新两个数组。

于 2013-05-20T15:09:26.313 回答