如何在选项 angular 中获取所选项目

Question

我有一个 dropdown，里面装满了 ObjectA 类型的项目。

item.component.html:

<label>items list:
    <select formControlName="itemsCtl" (change)="onChange()">
        <option *ngFor="let item of itemList" [value]="item">{{item.label}}</option>
    </select>
</label>

在我的反应式表单中，我需要选择项目，但是当我在 Internet 上进行大量搜索时，我找到了适合我的目的的代码：

item.component.ts:

selectedItem : ObjectA;
...
onChange()
{  
    this.selectedItem = this.factorForm.controls['itemsCtl'].value;
}

但是当我得到选择的项目时它是 [object object] 而我需要选择的项目是 ObjectA。如何将项目选为 ObjectA 或者如何将 [object object] 转换为 ObjectA？

使用 Angular 5.0.1.

Answer 1

尝试使用 ngValue 指令而不是值。

    <option  *ngFor="let item of itemList"  [ngValue]="item"   >{{item.label}}</option>

Answer 2

嗯，我不太确定您的 (itemList) 或 (ObjectA) 的结构是什么

为此，我需要更多信息。

如果您的方法不起作用，请试试这个：

<label>items list:
<select formControlName="itemsCtl" (change)="onChange()" [(ngModel)]="someVar">
    <option *ngFor="let item of itemList" [value]="item">{{item.label}}</option>
</select>

然后在你的函数中：

selectedItem : ObjectA;
someVar: any;
...
onChange()
{  
    this.selectedItem = this.factorForm.controls['itemsCtl'].value;
    console.log(someVar);
}

看看这会得到什么输出。

希望所有这些对您有所帮助！

如何在选项 angular 中获取所选项目

How get the selected item in option angular

typescript

angular

angular-forms