时间戳

首页 > 解决方案 > 错误类型错误：value.forEach 不是函数

javascript - 错误类型错误：value.forEach 不是函数

问题描述

我需要使用 FormArray 从角度 6 创建更新。

我在以下代码中使用此代码editfrom.TS：

  valueIngrident=new FormArray([]);

    constructor(private brandService:BrandService,private PValueInfoService:ProductinfovalueService,private productinfoService:ProductinfoService,private catService:CategoryService,private produSrvice:ProductService, private route:ActivatedRoute,private fb:FormBuilder) {
    this.id= + this.route.snapshot.paramMap.get('id');
    this.productVM=this.produSrvice.InitialProduct();

   }

  ngOnInit() {

    this.InitialForm()
    this.GetMainCat();
    }

  InitialForm(){
    this.editFG=this.fb.group({
      productTitle:['',Validators.compose([Validators.required])],
      productName:['',Validators.compose([Validators.required])],
      color:['',Validators.compose([Validators.required])],
      productImageName:['',Validators.compose([Validators.required])],
      price:['',Validators.compose([Validators.required])],
      gurantyMonth:['',Validators.compose([Validators.required])],
      gurantyCompanyName:['',Validators.compose([Validators.required])],
      catId:['',Validators.compose([Validators.required])],
      brandId:['',Validators.compose([Validators.required])],
      values:this.valueIngrident
    })
    this.GetProductByID(this.id)
  }

  public GetProductByID(id:number){
    this.produSrvice.GetProductDetailById(id).subscribe((data)=>{
      this.productVM=data
      this.SelectBrand=data.brandId
      this.SelectCat=data.catId
      this.PName=this.productVM.productName
      this.editFG.setValue({
        productTitle:[data.productTitle],
        productName:[data.productName],
        color:[data.color],
        productImageName:[data.productImageName],
        price:[data.price],
        gurantyMonth:[data.gurantyMonth],
        gurantyCompanyName:[data.gurantyCompanyName],
        catId:[data.catId],
        brandId:[data.brandId],
        values:this.valueIngrident
      })
      this.ChangeFormByType(data.catId)
  })
  }

  get ValueFormControl(){
    return  this.editFG.get('values') as FormArray;
}

  public CreateValueFiled(PD:Productinfovalue[]){
    for(let element of PD )
    {
      this.valueIngrident.push(
        new FormGroup({
          infoId:new FormControl(element.infoId),
          value:new FormControl(element.value)
        })
      )
    }
}

  public ChangeFormByType(id:number){
    this.ChangeBrand(id)
      this.PValueInfoService.GetAllInfoValueForUpdate(id).subscribe(
        res=>{
          this.PD=res,
          this.CreateValueFiled(this.PD)
        }
      )
  }

我在 HTML 中使用它：

                <div class="form-inline lbin" formArrayName="values">
                <div class="form-inline lbin" *ngFor="let valueCtrl of ValueFormControl.controls; let i=index" [formGroupName]="i">
                    <div  class="form-inline lbin">
                        <label></label> 
                        <input formControlName="value" >
                    </div>
                </div>
            </div>

但是当页面加载时，它会显示这个错误：

错误类型错误：value.forEach 不是 FormArray.push../node_modules/@angular/forms/fesm5/forms.js.FormArray.setValue (forms.js:3545) 处的函数

问题是什么？

标签： javascriptangulartypescriptangular6

解决方案

FormArray 具有函数 setValue。第一个参数应该是一个数组。您正在发送一个对象。

查看你的函数的中间你GetProductByID(id:number) 在这里调用this.editFG.setValue({...})

从官方文档：

setValue(value: any[], options: { onlySelf?: boolean; emitEvent?: boolean; } = {}): void 参数 value any[] 控件的值数组

options 对象配置选项，确定控件如何传播更改并在值更改后发出事件

onlySelf：当为真时，每个更改只影响此控件，而不影响其父控件。默认为假。emitEvent：当为 true 或未提供（默认值）时，statusChanges 和 valueChanges 可观察对象都会在控件值更新时发出具有最新状态和值的事件。如果为 false，则不会发出任何事件。配置选项被传递给 updateValueAndValidity 方法。选修的。默认为 {}。

返回无效

您的参数包含在 {} 中，这使其成为一个对象。函数规范说它需要是一个数组。

setValue 函数在数组上调用 forEach，而对象没有 forEach，这就是为什么它说 value.forEach 不是函数的原因。

推荐阅读