如何在具有三个单选按钮的每一行内部使用ngFor选择单选按钮

时间:2019-07-19 07:12:22

标签: angular

 <div class="box-row" *ngFor="let item of form3Persons; let i=index;">
  <div class="box">{{item.person_name}}</div>
      <div class="box">
          <div class="radio radio-info radio-inline">
            <input type="radio" id="suitable1-yes" name="suitable" value="yes" [(ngModel)]="form3Persons[i].suitable">
                <label for="suitable1-yes">Yes</label>
                              </div>
                              <div class="radio radio-info radio-inline">
                                <input type="radio" id="suitable1-no" name="suitable" value="no" [(ngModel)]="form3Persons[i].suitable">
                                <label for="suitable1-no">No</label>
                              </div>
                              <div class="radio radio-info radio-inline">
                                <input type="radio" id="suitable1-na" name="suitable" value="na" [(ngModel)]="form3Persons[i].suitable">
                                <label for="suitable1-na">NA</label>
                              </div>
                            </div>
                            <div class="box">
                              <div class="radio radio-info radio-inline">
                                <input type="radio" id="competent1-yes" name="competent" value="yes" [(ngModel)]="form3Persons[i].competent">
                                <label for="competent1-yes">Yes</label>
                              </div>
                              <div class="radio radio-info radio-inline">
                                <input type="radio" id="competent1-no" name="competent" value="no" [(ngModel)]="form3Persons[i].competent">
                                <label for="competent1-no">No</label>
                              </div>
                            </div>
                            <div class="box wp-20">
                              <button class="btn btn-primary btn-outline btn-block" data-target="#attachreference"
                                data-toggle="modal" id="relevent-doc" type="button">
                                <i class="fas fa-upload"></i> Upload documents </button>
                            </div>
                            <div class="box">
                              <textarea name="remarks" class="form-control" id="" cols="30" rows="2" [(ngModel)]="form3Persons[i].remarks"></textarea>
                            </div>
                          </div>

                        </div>

如何使用ngFor选择单选按钮,每行内部有3个角形单选按钮。一旦我们选择第一行,该事件也会在第二行触发,如何解决它。

0 个答案:

没有答案