Question

我有这个对象数组，我把它放在select选项上，我想在select选项中选择一个对象列表。但是我无法获得该对象列表的值。它输出[object] [Object]。我想获得该公司的选定对象列表。我将它分配给[value]，它得到[object] [Object]。

<div class="select" >
    <select class="form-control col-lg-8" #selectedValue (change)="assignCorporationToManage(selectedValue.value)">
        <option *ngFor="let corporation of user_corporations" [value]="corporation">{{corporation.corp_name}}</option>    
    </select>
</div>

TS

assignCorporationToManage(selectedValue) {
     console.log(selectedValue)
}

Answer 1

试试这样：

为您的选择添加ngModel并使用 ngModelChange 而不是更改。

添加ngModel
使用ngModelChange而不是更改。
使用[ngValue]代替[value]。

<强> component.html

<select class="form-control col-lg-8" #selectedValue name="selectedValue" id="selectedValue" [(ngModel)]="selectedValue" (ngModelChange)="assignCorporationToManage($event)">
    <option *ngFor="let corporation of user_corporations" [ngValue]="corporation">{{corporation.corp_name}}</option>
</select>

Component.ts

assignCorporationToManage(selectedValue) {
     console.log(selectedValue)
}

Answer 2

您可以使用 selectedValue 从列表中获取该特定对象。

<select class="form-control col-lg-8" #selectedValue name="selectedValue" id="selectedValue" [(ngModel)]="selectedValue">
    <option *ngFor="let corporation of user_corporations" [ngValue]="corporation">{{corporation.corp_name}}</option>
</select>

在您的 ts 或 js 文件中，

const selectedObject = this.user_corporations.find((el: any) => {
  return el?.corporation == this.selectedValue;
});

之后，您可以随意使用 selectedObject。

在Angular中选择选项中的选定对象

2 个答案: