我有一个采用布尔值的模型:rational_thinker: boolean;
我从前端通过单选框设置其值,如下所示:
<label #radio class="my-radio-label mdl-radio mdl-js-radio mdl-js-ripple-effect">
<input #btn1 type="radio" value='true' [(ngModel)]='rational_thinker' name="rational_thinker" class="mdl-radio__button" (click)="getRationalThinker(btn1.value)">
<span class="mdl-radio__label">True</span>
</label>
<label #radio class="my-radio-label mdl-radio mdl-js-radio mdl-js-ripple-effect">
<input #btn2 type="radio" value='false' [(ngModel)]='rational_thinker' name="rational_thinker" class="mdl-radio__button" (click)="getRationalThinker(btn2.value)">
<span class="mdl-radio__label">False</span>
</label>
和设置值的方法:
getRationalThinker(value){
this.rational_thinker=value;
}
初始保存后,该值将存储到我的后端,当我再次检索它时,我希望预先选择相应的单选按钮,现在它显示为空白。
我该如何实现?
更新:
我相信是类型问题:
value='true' [(ngModel)]='rational_thinker'
在这里,'true'
from的value
是字符串类型,而true
from的模型是boolean
type。
您可以通过以下方法解决此问题:
在组件中:
public rationalThinkerModel: boolean = true;
在模板中:
<input #btn1 type="radio" value='rationalThinkerModel' [(ngModel)]='rational_thinker' name="rational_thinker" class="mdl-radio__button" (click)="getRationalThinker(btn1.value)">
<span class="mdl-radio__label">True</span>
</label>
<input #btn2 type="radio" value='!rationalThinkerModel' [(ngModel)]='rational_thinker' name="rational_thinker" class="mdl-radio__button" (click)="getRationalThinker(btn2.value)">
<span class="mdl-radio__label">False</span>
</label>
更新:
尝试添加以下内容:
[checked]="(rational_thinker === true) ? 'true' : 'false'"
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句