如何访问复杂嵌套 FormGroup 的属性答案

【问题标题】：How can I access a properties of complex nested FormGroup如何访问复杂嵌套 FormGroup 的属性
【发布时间】：2021-01-06 20:16:57
【问题描述】：

我正在尝试学习 Angular 中的反应形式。我能够写入所有属性，但 numb、alts、字母和文本。

**COMPONENT.TS**

createForm() {
    this.userForm = this.fb.group({
      fname: ['', [Validators.required]],
      lname: ['', [Validators.required]],
      email: ['', [Validators.email, Validators.required]],
      facility: ['', [Validators.required]],
      position: [''],
      test: this.fb.group({
        name: [''],
        id: [''],
        date: [''],
        scored: [''],
        wrong: [''],
        duration: [''],
        answers: this.fb.array ([
          this.fb.group({
            numb: [''],
            alts: this.fb.group({
              letter: this.fb.array([]),
              text: this.fb.array([])
            })
          })
        ])
      })
    })
  }

  get answerArray() {
    return this.userForm.get("answers") as FormArray;
  }

**COMPONENT.HTML**

  <form [formGroup]="userForm">
    <div formGroupName="test">
      <div formArrayName="answers">
        <div *ngFor="let ans of answerArray.controls; let i = index">
          <div [formGroupName]="i">
              <input type="text" formControlName="">
          </div>
        </div>
      </div>
    </div>
  </form>
  <pre>{{ userForm.value | json}}</pre>

我收到此错误：core.js:6241 ERROR TypeError: Cannot read property 'controls' of null

如果有人可以帮助我，请。我找到了这个例子，但我无法理解 https://stackblitz.com/edit/angular-nested-reactive-form-eg-na1ctu?file=src%2Fapp%2Fapp.component.html

【问题讨论】：

标签： angular angular-reactive-forms

【解决方案1】：

试试这个：

get answerArray() {
   return this.userForm.controls['test'].get("answers") as FormArray;   
}

或

get answerArray() {
   return this.userForm.get("test.answers") as FormArray;   
}

或

get answerArray() {
   return this.userForm.get(["test","answers"]) as FormArray;   
}

“answers”在“test”中，这就是它返回 undefiend 的原因。

编辑：要访问字母或文本，您可以执行以下操作：您必须使用 index 来知道要获取 formArray 中的哪个 formGroup。

get textArray(index: number): FormArray {      
  return this.answerArray().at(index).get('alts').get('text') as FormArray;
}

【讨论】：

要访问字母或文本怎么办？