如何动态更改 Angular 中元素的 id？

我在循环中有一个元素，我只想更改它的 id 以避免冲突。我做了一些搜索，但似乎找不到任何东西。

<div *ngFor="let location of job.tasks; let i = index">
  <div id="index-{{i}}">
    {{index}}
  </div>
</div>

问题是当我调用 ngOnInit 时document.getElementById('index-1')它返回 null，因为它还没有分配 id。

连接ngFor index(i） 里面id属性。

<div *ngFor="let location of job.tasks; let i = index">
  <div id="index-{{i}}">
    {{index}}
  </div>
</div>

你应该查询你的 DOMngFor循环结束，你可以在里面做同样的事情ngAfterViewInit生命周期事件

ngAfterViewInit(){
    console.log(document.getElementById('1'));
}

演示在这里 https://plnkr.co/edit/dFy18Z0hObzCWfsad70A?p=preview

使用更正确的方法来做到这一点#template-variable on ngFor模板和@ViewChildren装饰器找出各自的 DOM。