Question

我正在尝试获取一些无线电输入，其中一个必须预先选择。

以下是代码：

<div class='form-group que-box' *ngFor="let option of options">
     <input type='radio' id="{{option.optionId}}" name="radio" [(ngModel)]="optionSelected" value='{{option.optionId}}'>
     <label for='{{option.optionId}}'><span class="que">{{option.text}}</span></label>
 </div>

但是按钮没有被预先选中。我尝试有条件地将checked属性放在那里，但这也无济于事.Html使用checked属性进行渲染但仍然没有选项得到预选。我还检查optionSelected总是包含所需的值。

Answer 1

将optionSelected设置为您要选择的选项的值应该有效，例如：

this.optionSelected = option[0].optionId;

如果optionId是数字或除字符串以外的任何内容，则使用interpolation（value='{{ option.optionId }}'）设置值将不起作用，因为它将被评估为字符串，因此它使用strict equality (===)进行检查时，optionSelected将不匹配，Angular正在使用它。

快速解决方法是强制optionSelected成为字符串：

this.optionSelected = option[0].optionId + '';

解决此问题的正确方法是使用data binding设置value属性。

在Angular（Angular 2和4）中：

[value]="optionSelected"

在AngularJS（Angular 1）中：

ng-value="optionSelected"

如何在Angular中使用双向绑定时预先选择单选按钮？

1 个答案: