Question

我正在尝试使用“ ng For”来检查下拉列表。我可以在下拉菜单中看到所有条目，但是当我选择一个条目时，它会引发错误。错误是“尝试对diff'1'进行错误。仅允许数组和可迭代”

HTML：-

<div class="form-group">
    <label for="customerGroup">Group</label>
    <select [(ngModel)]="customerGroup" (change)="onGroupChange($event)">
        <option *ngFor="let item of customerGroup" [value]="item.groupId">{{item.groupName}}</option>
    </select>
  </div>

TS：-

private customerGroup: any[] = [{
groupId: 1,
groupName: 'Group 1'

}];

public onGroupChange(event): void { 
const groupId = event.target.value;

}

Click Here for Error screenshot

Answer 1

您还使用了数组var作为模型变量。为select使用其他变量，它将正常工作。

<div class="form-group">
<label for="customerGroup">Group</label>
  <select name="customerGroup" [(ngModel)]="selectedCustomerGroup" (change)="onGroupChange($event)">
  <option *ngFor="let item of customerGroup" [value]="item.groupId">{{item.groupName}}</option>
  </select>
</div>

其他所有相同的东西。

  customerGroup: any[] = [{
    groupId: 1,
    groupName: 'Group 1'
  },
  {
    groupId: 2,
    groupName: 'Group 2'
  }];

  onGroupChange(event): void { 
    let groupId = event.target.value;
    //console.log(groupId);
  }

Demo Example

* ng对于项目选择错误-角度

1 个答案: