Question

在下面显示的代码中，我正在迭代deliveryMethods，它们在视图中显示为单选按钮。我打算预先选择第一个单选按钮。我应用以下属性：[checked] =＆＃34; ndx == 0＆＃34;其中ndx是每次迭代的索引。但没有选中单选按钮。如何动态预先选择第一个单选按钮？

<div *ngFor="let dm of deliveryMethods; let ndx=index">
                  <label class="form-check-label">
                    <input class="form-check-input f-s-1pt2" type="radio" 
                      name="dm.name" 
                      value="{{dm.name}}" 
                      [(ngModel)]="item.item.deliveryMethod"
                      (change)="filterProducts(item)"
                      [checked]="ndx==0"
                      class="radio-dimension"> 
                      {{dm.label}}
                  </label>
                </div>

Answer 1

我删除了[(ngModel)]并使用属性绑定[value]将值绑定到单选按钮控件。以下代码适用于我

<div *ngFor="let dm of deliveryMethods; let ndx = index">
              <label class="form-check-label">
                    <input class="form-check-input f-s-1pt2" type="radio" 
                      name="dm.name" 
                      [value]="dm.name"
                      (change)="filterProducts(item)"
                      [checked]="ndx === 0"
                      class="radio-dimension"> 
                      {{dm.label}}
             </label> 
       </div>

这是一个工作的plunker https://plnkr.co/edit/6Ay2zr7Ow3csB5Pxdgdz?p=preview

Angular：＆＃34;已检查＆＃34;无线电输入属性无法按预期工作

1 个答案: