How do you dynamically change the id of an element in Angular?

I have an element in a loop and I just want to change it's id so as to avoid conflicts. I did some searching, but can't seem to find anything.

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

The problem is when I call in ngOnInit document.getElementById('index-1') it returns null because it hasn't assigned the id yet.