zone.js：192未捕获的错误：找不到路径为：项目-> 0->内容的控件

Question

我几乎每天都在处理这个问题。我不明白这是怎么回事。

我在应用程序中使用反应形式，当我显示创建形式时，它运行良好。

但是，当我尝试显示编辑表单时，总是出现错误：

zone.js：192未捕获的错误：找不到路径为“ items-> 0-> content”的控件

我用下面的代码创建表单：

  createFormGroup() {
    return this.formBuilder.group({
      items: this.formBuilder.array([this.createProductItems()]),
    });
  }

  createProductItems() {
    const productItems = [];
    if (this.sourceProduct) {
      this.sourceProduct.items.forEach(value => {
        productItems.push(this.createProductItem());
      });
    }

    return productItems;
  }

createProductItem方法a定义如下

  createProductItem(): FormGroup {
    return this.formBuilder.group({
      content: ['', [Validators.required]],
      quantity: ['', [Validators.required]]
    });
  }

在我的模板中，我有以下内容html：

      <div class="form-group row">
        <label class="col-md-1 col-form-label label-main">{{"Items" | translate}}
          <i (click)="addItem()" class="icon-button nb-plus-circled mr-1 fa-3x"></i>
        </label>
        <div class="col-md-9" formArrayName="items">
          <div class="row"
               *ngFor="let item of itemsArray.controls; let i = index;">
            <div [formGroupName]="i" class="product-item-wrapper col-md-12">
              <div class="row mt-2 product-item-row" >
                <input type="text" class="form-control col-md-3 mb-2 ml-1" formControlName="content"
                       placeholder="Content"
                       [(ngModel)]="sourceProduct.items[i].content"
                       name="content">
                <input type="number" class="form-control col-md-2 mb-2 ml-1" formControlName="quantity"
                       placeholder="Quantity"
                       [(ngModel)]="sourceProduct.items[i].quantity"
                       name="quantity">
              </div>
            </div>
          </div>
        </div>
      </div>

我在ngOnInit方法中创建表格，我也尝试将其移至字段初始化

但是，在这种情况下，该sourceProduct变量不可用。

我不知道出什么问题了，请帮助解决此问题。