ajax - Angular.js - 来自 AJAX 请求的数据作为 ng-repeat 集合

Question

在我的网络应用程序中，我每 3-4 秒从 AJAX 调用 API 接收一次数据，如下所示:

$http.get('api/invoice/collecting').success(function(data) {
    $scope.invoices = data
}

然后显示数据，如下所示:http://jsfiddle.net/geUe2/1/

问题是每次我这样做 $scope.invoices = data ng-repeat 重建了 jsfiddle 中显示的 DOM 区域，我失去了所有 <input>值(value)观。

我尝试过:

• angular.extend()
• 深度版本jQuery.extend
• 其他一些合并\扩展\深复制功能

但他们无法处理这样的情况:

在我的客户端上有 [invoice1, invoice2, invoice3]服务器向我发送 [invoice1, invoice3] 。所以我需要从 View 中删除invoice2。

有哪些方法可以解决这个问题？

Answer 1

检查 ng-repeat 文档 Angular.js - Data from AJAX request as a ng-repeat collection您可以使用track by选项:

variable in expression track by tracking_expression – You can also provide an optional tracking function which can be used to associate the objects in the collection with the DOM elements. If no tracking function is specified the ng-repeat associates elements by identity in the collection. It is an error to have more than one tracking function to resolve to the same key. (This would mean that two distinct objects are mapped to the same DOM element, which is not possible.) Filters should be applied to the expression, before specifying a tracking expression.

For example: item in items track by item.id is a typical pattern when the items come from the database. In this case the object identity does not matter. Two objects are considered equivalent as long as their id property is same.