时间戳

首页 > 解决方案 > 角度 *ngFor 指令是否需要 trackBy 了？

angular - 角度 *ngFor 指令是否需要 trackBy 了？

问题描述

app.component.html 文件：

<button (click)="update()">Add More</button>
<ul>
  <li *ngFor="let person of persons; trackBy: trackFn">
    {{ "Name:- " + person.name + " || Age:- " + person.age }}
  </li>
</ul>

app.component.ts 文件：

export class AppComponent {
  persons = [
    {
      name: "Huzaifa",
      age: 16
    },
    {
      name: "John",
      age: 28
    },
    {
      name: "Kerma",
      age: 22
    }
  ];

  update() {
    this.persons.push({
      name: "umair",
      age: 20
    });
  }
}

当我学习 Angular 7 时，我注意到我必须在更新数据时使用 trackBy 来跟踪项目。否则 Angular 正在更新应用 ngForOf 指令的整个 DOM。我们可以通过 chrome 开发人员的粉红色突出显示工具

但

现在，即使不使用 trackBy 功能，我也不会遇到这个问题！

你注意到了吗？

帮我

也请不要报告我如果在提问时做错了什么......只要告诉我我的错误，我会尽力改进......

标签： angular

解决方案

我用 angular 7 尝试了来自 HTTP 请求的数据，没有 trackBy 角度更新整个事情

推荐阅读