选定属性不起作用的角度选择选项

概述使用Angular 4,我有一个html模板,我想要一个有两个选项的选择框.默认情况下应预先选择其中一个选项. <select name="rate" #rate="ngModel" ngModel required> <option selected value="hr">hr</option> <option value="yr">yr</option></select> 细 使用Angular 4,我有一个HTML模板,我想要一个有两个选项的选择框.默认情况下应预先选择其中一个选项.

<select name="rate" #rate="ngModel" ngModel required>    <option selected value="hr">hr</option>    <option value="yr">yr</option></select>

细节：

我指定#rate =“ngModel”,以便我可以在条件语句中或插值{{rate.value}}中引用模板中其他位置的值.为此,我只需将ngModel添加到标记中.我没有绑定到组件类中的任何内容,因为此控件仅用于将其值提供给同一模板中的另一个控件.

问题：

在Chrome和Microsoft Edge中,该框为空,未选择默认值.如果我摆脱#rate =“ngModel”ngModel它就可以了.但是,我需要引用rate.value.

我尝试了ngValue,value,[ngValue],[value]的各种组合,但我并没有尝试将值绑定到模型而我没有使用ngFor循环.
选择框上没有其他样式.

解决方法 如果您不希望进行双向绑定,可以将ngModel设置为“default”值,并使用模板局部变量获取所选值：

<select #rate ngModel="hr">    <option selected value="hr">hr</option>    <option value="yr">yr</option></select><p *ngIf="rate.value == 'hr'">hr</p> <p *ngIf="rate.value == 'yr'">yr</p>{{rate.value}}

DEMO

总结

以上是内存溢出为你收集整理的选定属性不起作用的角度选择选项全部内容，希望文章能够帮你解决选定属性不起作用的角度选择选项所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。