Question

我试图在formarray内的formcontrol上实现材质自动更正，但是当我尝试访问ts文件中的formcontrol时，它无法访问它。谁能帮我。

html文件：

<div formArrayName="applicants">
          <div *ngFor="let applicant of appForm.controls.applicants.controls; let i=index; let last = last">
            <div [formGroupName]="i">
              <div class="row">
                <label for="applicant_short_name" class="col-sm-3 form-control-label">Applicant {{i+1}}</label>
                <div class="col-sm-7">
                  <div class="form-group">
                    <!-- <input type="text" formControlName="applicant_short_name" class="form-control" id="inputFirstName" placeholder="Applicant"> -->
                    <!-- <mat-form-field > -->
                      <input  type="text" class="form-control" id="inputFirstName" placeholder="Applicant" [matAutocomplete]="auto" [formControlName]="applicant_short_name">
                      <mat-autocomplete #auto="matAutocomplete">
                        <mat-option *ngFor="let state of filteredNames | async | slice:0:3" [value]="name">
                          <span>{{ name }}</span>
                        </mat-option>
                      </mat-autocomplete>
                    <!-- </mat-form-field> -->
                  </div>
                </div>

ts文件：

    this.appForm.controls.applicants.controls[0].controls.applicant_short_name.valueChanges.subscribe(val => {
    this.filterNames(val);
 });

其中appform是我的表单组申请人是formarray 申请人的简称是formcontrol。

截至目前，controls [0]引发错误，表明AbstractControl不存在该控件。

有人可以在这里帮助我吗？

谢谢！

Answer 1

您需要将对象类型定义为具体类，而不是仅依赖于接口。我假设将appForm定义为代码中某处的FormGroup或FormArray（您应该显示所有相关代码）。但是，两个类的controls成员都返回AbstractControl[]，而AbstractControl接口没有controls成员-它仅在FormGroup和{ {1}}。因此，假设您使用的是FormArray，则需要强制转换：

FormGroup

您也可以将语句强制内联，但这会使阅读变得很混乱。

在FormArray内访问FormGroup中的FormControl

1 个答案: