时间戳

首页 > 解决方案 > 将 ngModel 添加到单选按钮时，默认选中在角度 6 中不起作用

angular - 将 ngModel 添加到单选按钮时，默认选中在角度 6 中不起作用

问题描述

将 ngModel 添加到单选按钮时，默认选中的选项不起作用。如果未使用 ngmodel，则选中的选项有效。但我想要这两个选项。有很多与此相关的问题，但没有一个解决方案对我有用，那么只有我提出新的问题。如果有人澄清为什么在添加 ngModel 时检查不起作用，解决方案是什么？

   Tried code:     

        <div class="col-md-9">
            <div class="form-check form-check-inline">
              <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio1" value="" [(ngModel)]="name.Status"[checked]="!isChecked">
              <label class="form-check-label" for="defaultInlineRadio1">Active</label>
            </div>
            <div class="form-check form-check-inline">
              <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio2" value [(ngModel)]="name.Status">            
              <label class="form-check-label" for="defaultInlineRadio1">Inactive</label>
            </div>
          </div>

另一种方法：

<input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio1" value="Active" [(ngModel)]="name.Status">
              <label class="form-check-label" for="defaultInlineRadio1">Active</label>       

              <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio2" value="InActive" [(ngModel)]="name.Status">
 <label class="form-check-label" for="defaultInlineRadio1">Inactive</label>

另一种方法：

  <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio1" value="Active" checked [(ngModel)]="name.Status">
                          <label class="form-check-label" for="defaultInlineRadio1">Active</label>       

                          <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio2" value="InActive" [(ngModel)]="name.Status">
             <label class="form-check-label" for="defaultInlineRadio1">Inactive</label

    ts:

        this.name.Status = 'Active';

另一种方法：

         <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio1" value="ngModel" checked [(ngModel)]="name.Status">
                  <label class="form-check-label" for="defaultInlineRadio1">Active</label>       

                  <input class="form-check-input" type="radio" name="radio_default_inline" id="defaultInlineRadio2" value="ngModel" [(ngModel)]="name.Status">
     <label class="form-check-label" for="defaultInlineRadio1">Inactive</label

我希望默认检查选项和绑定都有效。如何实现这一点？不要说重复的问题我尝试了与此问题相关的所有解决方案。

标签： angular

解决方案

您希望如何确定复选框的值？是模型领先还是被检查的属性领先？Angular 应该如何解决这个问题？快速回答：Angular 认为您的模型领先，因此您的检查属性不起作用。您必须简单地修改 ts 文件中的模型，而不是使用 checked 属性。

喜欢：

set isChecked(checked: boolean) {
   this._isChecked = checked;
   this.name.Status = checked;
}

还有一件事; 您显然必须设置单选按钮的值。以我的例子来判断真假。

推荐阅读