错误错误:找不到带有路径的控件:“响应->响应”(Angular 8)FormArray

时间:2020-05-04 13:17:32

标签: javascript angular forms primeng formarray

我正在尝试使用FormArray来获取已使用for循环迭代的输入的值。我用过priming表。代码如下

AppComponent HTML

<div formArrayName="responses">
  <p-table [value]="datas">
    <ng-template pTemplate="header">
    <tr style="border: none;">
            <th>Question No</th>
            <th>Questions</th>
            <th>Data</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-data #input>
      <tr>
        <td>{{data.id}} </td>
        <td [ngClass]="{'objectiveClass' : datas.Type != 'Narrative','narrativeClass':datas.Type == 'Narrative'}">{{ data.Question }}</td>
        <td *ngIf="datas.Type != 'Narrative'">
            <input class="form-control"
             id="objective"
             type="number"
             (keyup)="patternChecking(number)"
             formControlName="response"
             #number/>
        </td>
  <td *ngIf="datas.Type == 'Narrative'">
            <textarea #narrative rows="4" cols="50" maxlength="5000" 
            formControlName="response"
            (keyup) ="charactersRemaining()"
            ></textarea>
            <span  *ngIf = "isCharactersRemaining">
                <em>{{ textMaxLength - narrative.value.length }} characters remaining</em></span>
        </td>
    </tr>
    </ng-template>
</p-table>
</div>

AppComponent TS

 this.responseForm = this.fb.group({
    responses : this.fb.array([this.fb.group({
      response:new FormControl ('')
    })])
   });

我无法使用上面的代码识别问题。

enter image description here

1 个答案:

答案 0 :(得分:0)

FormArray的API非常笨拙。实际上,您必须遍历FormArray内部的每个控件。像这样:

<div *ngFor="let control of responseForm.get('responses').controls; let i = index">
     <div [formGroupName]="i">
          <input
             formControlName="response"
          />
     </div>
</div>