使用 angular material 在下拉列表中显示数据 json

Question

我用 angular material 创建了一个 Angular 项目，我想在下拉列表中显示单位列表。

数据像预期的那样出现：

这是我的 .ts 代码：

ListUnits:Array<Unit>=[]

units(){
return this.trq.getListUnit().subscribe(
  (data)=>{
    this.ListUnits.push(data.respModel);
    console.log(this.ListUnits);
  }
)

}

这是我的 .HTML 代码：

<mat-label>Unite</mat-label>
            <mat-select formControlName= "unite_id" required>
                <mat-option *ngFor="let unit of ListUnits"[value]="unit.id">
                  {{unit.unitName}}
                </mat-option>
            </mat-select>

但不幸的是，什么都没有出现实现该目标需要遵循哪些步骤？

Answer 1

您正在将数组推入数组。如果您想在 ListUnits

中保留当前数据，请改为执行此操作

this.ListUnits = [...this.ListUnits, ...data.respModel];

否则只需将响应中的数组分配给 ListUnits

this.ListUnits = data.respModel;

使用 angular material 在下拉列表中显示数据 json

Display data json in dropdown using angular material

javascript

angular

typescript

angular-material