Question

<select class="form-control" (change)="onChange(user.id)">
            <option disabled selected="selected">By User</option>
          <option *ngFor="let user of allUsers">{{user.first_name}} {{user.first_name}}</option>
        </select>

名字和姓氏仅用于显示我需要发送到ts文件的值为user.id

(change)="onChange(user.id)确实可以工作，因为它在循环之外。我需要在更改后发送所选用户ID的值。

Answer 1

您需要将user.id绑定到<option>标签的值：

<select class="form-control" (change)="onChange($event.target.value)">
  <option disabled selected="selected">Invoice By User</option>
  <option *ngFor="let user of allUsers" [value]="user.id">
    {{user.first_name}} {{user.first_name}}
  </option>
</select>

有关更多示例和信息，请参见here

Answer 2

我认为应该是这样的

<select (change)="onChange($event.target.value)">
 <option *ngFor="let user of allUsers" [value]="user.id">{{user.first_name}} {{user.first_name}}
 </option>
</select>

Answer 3

<select class="form-control" formControlName="userInvoice" (change)="onChange()">
  <option disabled selected="selected">Invoice By User</option>
  <option *ngFor="let user of allUsers" [value]="user.id">
    {{user.first_name}} {{user.first_name}}
  </option>
</select>

onChange(){
    console.log(this.userInvoiceformGroup.get('userInvoice').value);
}

Answer 4

尝试以下方法：

<select (change)="onChange($event.target.value)">
    <option *ngFor="let user of allUsers">{{user.first_name}} {{user.first_name}}</option>
</select>

和onChange这样

onChange(user) {
    console.log(user);
}

在ngFor select选项中，如何在onChange

4 个答案: