更新范围时,NG-Repeat不会干净地更新

Question

所以我有一个工作区列表:

<li class="workspace-object" ng-repeat="w in workspaces | filter:searchQuery" ng-click="selectWorkspace(w)">
    <a href="" class="workspace-link">{{w.name | titleCase }}</a>
</li>

该List通过某个函数在数据库中更新,然后我调用下面的loadWorkspaces函数,重新填充$ scope.workspaces对象

$scope.loadWorkspaces = function() {
  APIService.getWorkspaces().then(function(data){
    $scope.workspaces = data;
  });
}

发生这种情况时,$ scope.workspaces在注销时会立即读取正确的更新信息,但是,ng-repeat DUPLICATES会在更新到正确的列表之前.我不知道为什么会这样.有任何想法吗？在此示例中,我正在更新工作区标题,该更新运行loadworkspaces函数.

Answer 1

试试这个 ...

w in workspaces track by $index

当集合的内容发生变化时,ngRepeat会对DOM进行相应的>更改:

• 添加项目时,会将新模板实例添加到DOM.
• 删除项目后,将从DOM中删除其模板实例.
• 重新排序项目时,它们各自的模板将在DOM中重新排序.

默认情况下,ngRepeat不允许在数组中使用重复项.这是因为当存在重复项时,不可能在集合项和DOM元素之间保持一对一的映射.

如果确实需要重复重复项目,则可以使用track by表达式替换自己的默认跟踪行为.

例如,您可以使用特殊范围属性$ index按集合中每个项目的索引跟踪项目