Question

    `<select class="form-control" id="customer" required [(ngModel)]="application.customer" name="customer" #customer="ngModel">
      <option *ngFor="let customer of customers" [ngValue]="customer">
        {{customer.id}} {{customer.first_name}} {{customer.last_name}}</option>
    </select>`

application.customer和customer都是Customer对象的类型。在组件中填充应用程序时，不会设置默认值。其他文本输入字段如application.vehicle_make可以毫无问题地加载。有没有人知道为什么没有选择应用程序的默认值？我正在使用最新的角度5。

Answer 1

将其与您特定用途的ID捆绑在一起！

<select class="form-control" id="customer" required [(ngModel)]="application.customer" name="customer" #customer="ngModel"> <option *ngFor="let customer of customers" [value]="customer.id"> {{customer.id}} {{customer.first_name}} {{customer.last_name}}</option> </select>

现在[ngValue] trun到[value]

Answer 2

有可能customer of customers等于application.customer。如果要选择默认值，则需要将该属性添加到其中一个项目中：

  <option *ngFor="let customer of customers; let first = first;" [ngValue]="customer" selected="first">
    {{customer.id}} {{customer.first_name}} {{customer.last_name}}</option>

这将选择customers数组中的第一项。您还可以使用let i = index;中的*ngFor来选择特定索引，甚至可以使用let last = last。这会将application.customer设置为等于所选的customer of customers。

Angular 4表单选择能够显示默认值

2 个答案: