如何防止 *ngFor 在 Angular 4 中更新 DOM？

Question

在 angular 4 中，我使用 *ngFor 来显示一些图像

<div  *ngFor='let image of images;let i = index'>
    <img  [src]="'/assets/Images/'+image+'.png'" *ngIf="!tohide(i,0);">
</div>

第一次完成 *ngFor 后，我希望通过 *ngIf 删除特定图像，而不更改数组“图像”。问题是每当我使用我的函数“tohide”删除图像时，*ngFor 再次绑定到“图像”并更新图像集。

换句话说，有没有办法强制 *ngFor 偶尔不听数组“图像”？

Answer 1

*ngFor 默认情况下具有跟踪功能，在您的情况下，您希望覆盖它。

<div  *ngFor='let image of images;let i = index; trackBy: myTrackByFunction'>
  <img  [src]="'/assets/Images/'+image+'.png'" *ngIf="!tohide(i,0);">
</div>

在你的 TS

myTrackByFunction(index, item) {
  return index; // or item.id, if your image has an ID
}

有关更多信息，请参阅此网页