假设我的屏幕上有 100 个由 *ngFor
生成的 div,它们从具有类似数据的对象中获取值
{A1:someOtherObject,A2:someOtherOtherObject...,J10:someOtherOtherObject}
我单击 A1,然后单击 J10,它们会切换其值。它变成了这样:
{A1:someOtherOtherObject,A2:someOtherObject...,J10:someOtherObject}
如何强制 Angular 只刷新两个仅保存 A1 和 J10 值的 div?我正在使用 ChangeDetectionStrategy.OnPush
,在构造函数中我有 cd.detach()
并且仅在发生第二次点击时调用 cd.detectChanges()
。从我所看到和能够理解的来看,每个 div 都会触发它们的 *ngIf
因此它们中的每一个都会被重新创建。
我可以做些什么来 a) 覆盖正在刷新的内容或 b) 选择检测更改的内容?
最佳答案
如果您track the items在您的列表中,*ngFor="let item of items; trackBy: trackById"
。
然后它不会再次渲染所有项目。
trackById = trackBy('id');
...
export function trackBy(field: string): (_index: number, item: any) => string | number {
return (_index: number, item: any) => {
if (!item) {
return null;
}
return item[field] as (string | number);
};
}
关于 Angular 变化检测: how to refresh only certain items?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58961995/