如何防止：ngFor 在任何点击事件上重新渲染

所以，每当我打电话/点击unRelatedFunction()它使ngFor再次循环重新渲染。有什么办法可以避免这种不必要的连接吗？我正在使用 Angular 12。

如果我缺少任何必需的信息，请告诉我。谢谢

//html

<div *ngFor="let item of arr">{{ create(item) }}</div>

<button type="button" (click)="unRelatedFunction()">test</button>

//ts

   arr = [1, 2, 3, 4, 5, 6, 7];

   create(val) {
    console.log("again ?");
    return val + 1
  }

  unRelatedFunction() {
    console.log("test");
  }

您可以使用trackBy

HTML

*ngFor=“let item of arr; trackBy: value”

TS

value(index, item){
  return item;
}

详细解释在这里 https://stackoverflow.com/questions/42108217/how-to-use-trackby-with-ngfor