Question

我需要在表单中显示值以供以后编辑。总是向我显示此错误“ ERROR错误：control.registerOnChange不是函数”

我以此方式构建表单

 form = this._fb.group({
  createdAt:'',
  customer: this._fb.group({
    name: '',
    lastname: '',
    phone: '',
    address: ''
  }),
  purchases: this._fb.array([ <-- this is the problematic,the others work well
    this._fb.group({
      product: this._fb.group({
        name:'',
        location:'',
        categoryS:'',
        price:''
      }),
      quantity: ''
    })
  ])      
});

并尝试显示它

   <div formArrayName="purchases">
        <label>Products:</label> 
     <div *ngFor="let product of form.controls.purchases.controls; let i = index">
         <input [formControlName]="i" class="form-control"/>            
      </div>
     </div>

有什么想法吗？

View in StackBlitz

Answer 1

我可以分享我的想法。

按如下所示更改模板：

<div *ngFor="let product of form.controls.purchases.controls; let i = index" [formGroupName]="i">
  <div formGroupName="product">
    <input formControlName="name" class="form-control"/>  
    <input formControlName="location" class="form-control"/>     
    ...
  </div>
</div>

还要确保您在编辑操作时正确填写了购买数组：

invoice.purchases.forEach(purchase => {
  purchasesFormArray.push(this._fb.group({
    product: this._fb.group(purchase.product),
    quantity: purchase.quantity
  }));
});

还检查了分叉的 Stackblitz Example

（角度5）错误：control.registerOnChange不是函数

1 个答案: