Fatal编程技术网
  • arrays/
  • Arrays 角度阵列更新，无需完全刷新

Arrays 角度阵列更新，无需完全刷新

arrays angular

Arrays 角度阵列更新，无需完全刷新,arrays,angular,Arrays,Angular,问题： 有一个数组，例如 [{id: 1, name: "stefan"}, {id: 2, name: "alex"}, ...] 此列表绑定到一个*ngFor，该列表还可以显示详细信息 现在，来自服务器的更新显示了一个新列表 [{id: 1, name: "stefanie"}, {id: 2, name: "alexandra"}, ...] 因此，ids是相同的，但是names是相同的 要求： 现在，如果我想将新数组分配给现有数组，*ngFor将完全刷新，隐藏我的详细信息窗口。不过我

问题： 有一个数组，例如

[{id: 1, name: "stefan"}, {id: 2, name: "alex"}, ...]
此列表绑定到一个
*ngFor
，该列表还可以显示详细信息

现在，来自服务器的更新显示了一个新列表

[{id: 1, name: "stefanie"}, {id: 2, name: "alexandra"}, ...]
因此，
id
s是相同的，但是
name
s是相同的

要求： 现在，如果我想将新数组分配给现有数组，
*ngFor
将完全刷新，隐藏我的详细信息窗口。不过我只是想

  • 如果已经存在具有相同
    id
    的项目，则更新该项目
  • 添加新项目
  • 删除不再存在的项目
我找到了答案，你如何通过过滤和更新来做到这一点，然而这对我来说似乎是一个相当普遍的问题。所以我想总有一个内置函数或聪明的库可以解决这个问题。。。对吗？

您可能正在查找angular的
TrackBy
功能。使用
TrackBy
，Angular能够使用唯一标识符检测哪些项目被删除或添加到数组中。因此，只有添加或删除的项必须在DOM中更新

是对
TrackBy

的扩展解释。您可能正在查找angular的
TrackBy
功能。使用
TrackBy
，Angular能够使用唯一标识符检测哪些项目被删除或添加到数组中。因此，只有添加或删除的项必须在DOM中更新

是对您正在使用TrackBy查找的
*ngFor的扩展说明，请参见。
您正在使用TrackBy查找的*ngFor请参见