错误错误：找不到带有路径的控件：

Question

我正在利用Angular 4的FormBuilder和FormGroup类创建一个Form。表单的内容是通过GET调用提供的，该请求的问题和答案通过JSON格式构建。

使用本地主机时，在页面加载时从Web控制台看到以下错误：

任何具有Angular Forms专业知识的人都可以纠正此实现并解释我哪里出错了吗？

Web控制台表明该节点来自HTML：

<fieldset [formGroupName]="i">

为了简洁起见，我仅在下面提供裸露的摘要。让我知道您是否需要更多详细信息。

HTML组件：

<form id="form-clinicalscreener" [formGroup]="clinicalForm" (submit)="submitScreenerForm(clinicalForm)" novalidate>
<div formArrayName="Questions">
<div class="section" *ngFor="let tab of clinicalQuestionsResults; let i = index;">
    <h2 class="form-title">{{tab.DisplayText}}</h2>
    <div>
        <div class="form-group" *ngFor="let question of tab.Questions">
            <fieldset [formGroupName]="i">
                <label>{{question.DisplayText}}</label>
                <input type="hidden" formControlName="QuestionId" value="{{question.Id}}" data-value="{{question.Id}}">
                <div [ngSwitch]="question.AnswerType">
                    <div *ngSwitchCase="'Radio'" class="form-group-answers">
                        <div class="radio" *ngFor="let answer of question.Answers">                               
                            <input type="radio" 
                                formControlName="AnswerId" 
                                value="{{answer.Id}}" 
                                data-value="{{answer.Id}}" 
                                class="radio-clinicalscreener">
                            <label class="label-answer">
                                <span class="label-answer-text">{{answer.DisplayText}}</span>
                            </label>
                        </div>
                    </div>
                    <div *ngSwitchCase="'DropDown'" class="form-group-answers">
                        <select formControlName="AnswerId" class="form-control">
                            <option value="{{answer.Id}}" data-value="{{answer.Id}}" *ngFor="let answer of question.Answers">{{answer.DisplayText}}</option>
                        </select>
                    </div>
                </div>
            </fieldset>
        </div>
    </div>
</div>
</div>
<div class="text-center">
    <button class="btn btn-screener" type="submit" [disabled]="!clinicalForm.valid">Submit</button>
</div> 

TypeScript组件：

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';

@Component({
selector: '',
templateUrl: '',
styleUrls: ['']
})

export class FormComponent implements OnInit {
// Our model driven form.
clinicalForm: FormGroup;

// Screener Data from API call to be used by view in for loop.
clinicalQuestionsResults: any;

constructor(private formBuilder: FormBuilder) {}

ngOnInit() {
    // Let's get Clinical Screener metadata.
    this.loadClinicalScreener();

    // Initialize the form here.
    this.clinicalForm = this.formBuilder.group({
        Questions: this.formBuilder.array([
            this.initQuestions()
        ])
    });
}

private initQuestions() {
    // initialize our Questions
    return this.formBuilder.group({
        QuestionId: [''],
        AnswerId: ['']
    });
}

private loadClinicalScreener() {
    // An AJAX call from a forkJoin() to return the JSON payload, then I assign it to a local object, screenerResponse. 
    let screenerResponse: any = data[0];
    this.clinicalQuestionsResults = screenerResponse.Result.Tabs;
    console.log('Here is the metadata for Clinical Screener --->', this.clinicalQuestionsResults);
}

}