How to use angular material select with string map-CodePudding

I am trying to use the angular material with a string map which is filled from my backend (works) it after getting filled it has the following values: {key: ..., value: ...} but my select stays empty if I click on it it does not show me any values to select from. Can someone from you look at it and tell me what is wrong?

This is my html (only select):

<mat-select formControlName="legitimiertGwg" multiple >
    <mat-option *ngFor="let person of personArray" [value]="person.key">{{person.value}}</mat-option>
  </mat-select>

This is my ts file (only map):

  personArray = new Map<string, number>();

CodePudding user response：

You have to tell Angular to get for...loop iterations as [key, value] pair by adding the pipe "keyvalue" like below:

<mat-select formControlName="legitimiertGwg" multiple >
    <mat-option *ngFor="let person of personArray | keyvalue" [value]="person.key"> 
        {{person.value}}
    </mat-option>
</mat-select>