如何在动态 Select 控件中将 Object/Array 作为变量传递给 NgFor？

Question

我正在使用几个示例创建一个动态表单。如果我在 Select 组件的模板中定义了静态选项值，那一切都很好。但由于它是动态的，我想从方法中呈现 select 选项。

<div*ngFor="let control of FormData.controls">
<mat-select [formControlName]="control.name">
<mat-option *ngFor="let item of Countries">item.name</mat-option>
</mat-select>
</div>

现在我想为州、水果等制作动态图

*ngFor="let item of 'Countries'"

任何让它动态化并从 json 模板驱动它的方法

Answer 1

您需要在 mat-option 中添加值。

<div*ngFor="let control of FormData.controls">
    <mat-select [formControlName]="control.name">
    <mat-option *ngFor="let item of Countries" [value]="item.name">item.name</mat-option>
    </mat-select>
    </div>

Answer 2

您是否创建了一个对象并将数组置于键值对中，如下所示，

myNewObj = {}
**somewhere in my code**
this.myNewObj = {
  array1:['data1', 'data2'],
  array2:['data3', 'data4']
}

在HTML

<div *ngFor="let item of myNewObj['array1']">
   {{item}}
</div>

如何在动态 Select 控件中将 Object/Array 作为变量传递给 NgFor？

How to pass Object/Array as variable to NgFor in a dynamic Select control?

angular