Question

我有一个选择字段如下：

<select class="form-control" [(ngModel)]="myClient.address && myClient.address.state" name="state" (ngModelChange)="getCitiesByState($event)">
   <option class="form-control" *ngFor="let state of states" 
      [ngValue]="state">
       {{state.name}}</option>
</select>

但是，由于我重复使用相同的组件，如果我的ngModel有值，我希望将我的选项设置为值。例如，如果myClient.address有myClient.address = {"name":"Texas", "stateId":"2"}，我希望德克萨斯州成为所选的选项。

我如何实现这一目标？

Answer 1

<select class="form-control" [ngModel]="myClient.address?.name" name="state" (ngModelChange)="getCitiesByState($event)">
   <option class="form-control" *ngFor="let state of states" 
      [ngValue]="state">
       {{state.name}}</option>
</select>

现在，如果myClient.address有myClient.address = {"name":"Texas", "stateId":"2"}，我希望德克萨斯成为所选的选项。

您需要的所有更改都是[ngModel]="myClient.address?.name"添加?，它定义了可选行为，因此如果提供了它，那么它将被选中，如果没有，那么它将起作用，因为没有选择任何内容。

但在这里你必须提供至少myClient.address的价值或没有价值。

如果存在ngModel，请设置所选选项

1 个答案: