Question

我想默认选中单选按钮，但是当我使用[[ngModel）]时，它在角度6中不起作用。如删除[[ngModel）]一样，它可以正常工作我的代码是：

<div class="container-fluid">
              <div class="row">
                <div class="col-md-4">
                  <div class="custom-control custom-radio">
                    <input type="radio" id="user_type1"  name="user_type" class="custom-control-input" value="1" [(ngModel)]="form.user_type">
                    <label class="custom-control-label" for="user_type1">Vendor</label>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="custom-control custom-radio">
                    <input type="radio" id="user_type2" name="user_type" class="custom-control-input" value="2" [(ngModel)]="form.user_type">
                    <label class="custom-control-label" for="user_type2">Customer</label>
                  </div>
                </div>
              </div>

我也尝试过

<input type="radio" id="user_type1" name="user_type" class="custom-control-input" value="1" [checked]="true"  [(ngModel)]="form.user_type" >

谢谢。

Answer 1

使用[(ngModel)]将复选框值绑定到form.user_type属性值。因此checked="true"被忽略。

这是正确的行为，因为数据绑定优先考虑静态属性。

如果要默认选中checkbox，则需要将value属性和form.user_type匹配

编辑

尝试将value属性放在方括号之间，如下所示：

<div class="container-fluid">
              <div class="row">
                <div class="col-md-4">
                  <div class="custom-control custom-radio">
                    <input type="radio" id="user_type1"  name="user_type" class="custom-control-input" [value]="1" [(ngModel)]="form.user_type">
                    <label class="custom-control-label" for="user_type1">Vendor</label>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="custom-control custom-radio">
                    <input type="radio" id="user_type2" name="user_type" class="custom-control-input" [value]="2" [(ngModel)]="form.user_type">
                    <label class="custom-control-label" for="user_type2">Customer</label>
                  </div>
                </div>
              </div>

为什么默认检查属性在角度6中不起作用

1 个答案: