首页 文章

角度反应形式:无法通过路径找到控件:

提问于
浏览
2

我有组件:cabinet-clinic-form.component.ts这里我在诊所FormArray中有FormGroup验证的问题 . 当我渲染页面时,我得到错误prntscr with error我试图找到如何动态推送formGroups但仍然有错误 . 在按钮上单击开始在AddClinic()事件上,我添加新的诊所 .

这是我的代码:

export class CabinetClinicFormComponent implements OnInit {
      doctorForm: FormGroup;
      ngOnInit() {
        this.doctorForm = new FormGroup({
          'clinics': new FormArray([]),
        });
      }
      onAddClinic() {
        const newClinic = new FormGroup({
            'city' : new FormControl(null),
            'clinicname' : new FormControl(null),
        });
        (<FormArray>this.doctorForm.get('clinics')).push(newClinic);
      }
      onSubmit() {
        console.log(this.doctorForm);
      }
    }

和cabinet-clinic-form.component.html

<div
      class="clinic-group"
      formArrayName="clinics"
    >
      <div
        *ngFor="let clinicControl of doctorForm.get('clinics').controls; let clinicIndex = index;"
        [formGroupName]="clinicIndex"
      >
        <div class="clinic-group__title">Клиника #{{clinicIndex + 1}}</div>
        <div class="form-group">
          <label
            [attr.for]="'city' + clinicIndex + 1"
            class="control--label"
          >
            <span class="control--label-text">Город</span>
          </label>
          <input
            type="text"
            [attr.id]="'city' + clinicIndex + 1"
            [formControlName]="city"
            class="form-control"
          >
        </div>
        <div class="form-group">
          <label
            [attr.for]="'clinicname' + (clinicIndex + 1)"
            class="control--label"
          >
            <span class="control--label-text">Название клиники</span>
          </label>
          <input
            type="text"
            [attr.id]="'clinicname' + (clinicIndex + 1)"
            [formControlName]="clinicname"
            class="form-control"
          >
        </div>
      </div>
    </div>

    <button type="button" (click)="onAddClinic()">Добавить клинику</button>

1 回答

  • 2

    [formGroupName]="clinicIndex + 1" 更改为 [formGroupName]="clinicIndex" 在索引1处没有控制权

    <div
            *ngFor="let clinicControl of doctorForm.get('clinics').controls; let clinicIndex = index;"
            [formGroupName]="clinicIndex"
          >
    

相关问题