模板中默认选择 Angular 4 选项

【问题标题】：Angular 4 option selected by default in template模板中默认选择 Angular 4 选项
【发布时间】：2018-04-26 07:10:38
【问题描述】：

我希望默认选择一个选项，但它只有在我从选择中删除 NgModel 指令时才有效。

<select id="privileges" name="privileges" class="form-control" [(ngModel)]="value" required>
   <option [selected]="(user | async).privileges == Administrador" value="Administrador">Administrador</option>
   <option value="Empleado">Empleado</option>
</select>

如果我删除 ngmodel 指令，如果它运行良好，但显然这不是我需要的。

【问题讨论】：

这段代码看起来非常好，确保控制器中的“值”等于“管理员”或“Empleado”，如果不是很明显选择将为空，还要确保你导入 FormsModule 或 NgModelModule。
控制器中的数据没问题。事实上，删除 Model 中的指令一切正常。为什么添加此指令不会停止工作？那里会发生什么？

标签： javascript html angular option selected

【解决方案1】：

[selected]="..." 不适用于ngModel。

要选择一个值，请将值分配给您的 value 字段。 Angular 将选择该选项，其中value="..." 等于分配给[(ngModel)]="value" 中使用的value 字段的值。

如果使用的值不是字符串，请使用[ngValue]="..." 而不是[value]="..." 或value="{{...}}"。

【讨论】：

我如何将数据发送到控制器？如果我不放置 ngModel，则选择的值不会出现在对象中。
user.subscribe(val => this.value = privileges == Administrador) 或类似的。如果没有看到更多代码，很难说。 Administrator 到底是什么？如果这是一个字符串，您需要添加引号 (... == 'Administrator')（但不是在 selected="..." 上，因为如上所述，这不适用于 ngModel）