Angular 带有表单生成器的被动表单

获取错误'error error:cannotreadproperty'flag'of undefined'，我不理解为什么，正如我在html和js中定义的那样

我的Html

<form [formGroup]='formName'>
  <div formArrayName="Quest">
   <div class="form-group">
     <label for="flag">Quest1</label>
     <input type="radio" class="form-control" value="Y" id="username" name="flag" formControlName = "flag">
     <label for="flag">LastName</label>
     <input type="radio" class="form-control" value="N" id="username" name="flag" formControlName = "flag">
      <input type="text" class="form-control" *ngIf="formName.value.Quest1.flag == 'Y'" id="testName" name="testName" formControlName = "testName">
   </div>
 </div>
</form>     
<button (click)="consoleF(formName.value)">Click</button>                 
<p> value: {{ formName.value | json}}</p>
<p> valid: {{ formName.valid }}</p>`

---

它不起作用，因为该标志是在表单数组中定义的。您必须迭代每个表单数组控件

试试这个：

组成部分

formName = this.fb.group({
  Quest:  this.fb.array([
    this.fb.group({
      QUESTION_ID: this.fb.control('51'),
      flag: this.fb.control(''),
      testName: this.fb.control('')
    })
  ])

get quests() {
    return this.formName.get('Quest') as FormArray;
}

HTML文件

<div *ngFor="let quest of quests.controls; let i = index">
    <div [formGroupName]="i">
        // similarly you can add other fiels from array
        <input type="radio" class="form-control" value="Y" id="username" name="flag" formControlName = "flag">
    </div>
</div>

有关详细信息，请参阅您可以尝试此代码

---

有很多方法

在.ts中，返回表单对象

get f() {
   return this.formName.controls;
}

我认为，错误出现在html中

<input type="text" class="form-control" *ngIf="f.Quest.flag == 'Y'" id="testName" name="testName" formControlName = "testName">

get f() {
   return this.formName.controls;
}

<input type="text" class="form-control" *ngIf="f.Quest.flag == 'Y'" id="testName" name="testName" formControlName = "testName">