Angular ngfor selected from another array not working

Question

Sorry the title might be a bit confusing, but this is the problem.

This is the code I use.

<option #groupid
        *ngFor="let group of groups | async"
        [value]="group.id"
        [selected]="(announcement | async)?.group_id == group.id ? true : null">
  {{ group.name }}
</option>

(announcement | async)?.group_id is showing as null, but when I use it outside the ngFor, it shows the correct number.

Is that because of the ngFor?

Answer 1

This is how you should do it

<div *ngIf="announcement | async; let announce">
  <option #groupid
          *ngFor="let group of groups | async"
          [value]="group.id"
          [selected]="announce.group_id == group.id ? true : false">
    {{ group.name }}
  </option>
</div>