.forEach 不是 fromArray angular 上的函数

.forEach is not a function on fromArray angular

我正在处理一项要求,我必须循环通过 component.ts 文件中定义的 'formArray' 控件来设置表单提交时的验证。我收到类似“.forEach 不是函数”的错误 我的代码如下:

component.ts

ip_addresses_arr: any;

this.companyForm = this.fb.group({
   company_ip_addresses: this.fb.array([this.fb.group({
    id: 0,
    start_ip: new FormControl('', Validators.pattern("^([0-9]{1,3})[.]([0-9]{1,3})[.]([0-9]{1,3})[.]([0-9]{1,3})$")),
    end_ip: new FormControl('', Validators.pattern("^([0-9]{1,3})[.]([0-9]{1,3})[.]([0-9]{1,3})[.]([0-9]{1,3})$"))
  })]),
});

我在 formArray 上的 forEachloop 是:

saveCompanyInfo() {
  this.ip_addresses_arr = this.companyForm.get('company_ip_addresses');
  this.ip_addresses_arr.forEach(eachfield => {
    console.log("each field",this.ip_addresses_arr);
    if(eachfield.start_ip != "" && eachfield.end_ip == ""){
      console.log("coming inside end_ip is empty");
      eachfield.end_ip.setErrors({'incorrect': true});
      eachfield.end_ip.markAsTouched();
    }else if(eachfield.end_ip != "" && eachfield.start_ip == ""){
      console.log("coming inside start_ip is empty");
      eachfield.start_ip.setErrors({'incorrect': true});
      eachfield.start_ip.markAsTouched();
    }else{
      eachfield.start_ip.setErrors(null);
      eachfield.end_ip.setErrors(null);
    }
  });

  if (this.companyForm.valid) {
    -----------------
    -----------------
  }
}

我的问题是它说 .forEach 不是函数。谁能解释一下代码中的错误。任何帮助,将不胜感激。谢谢

这实际上是一个 linting 问题,打字稿和编辑器抱怨这个,因为 formInstance.get('controlName') returns 一个抽象控件。您必须告诉他们您收到的控件是一个 FormArray,您可以通过以下方式做到这一点:

this.ip_addresses_arr = this.companyForm.get('company_ip_addresses') as FormArray;

并且您需要将控件循环为。

this.ip_addresses_arr.controls.forEach()

并且您没有正确访问控件

saveCompanyInfo() {
  this.ip_addresses_arr = this.companyForm.get('company_ip_addresses') as FormArray;
  this.ip_addresses_arr.controls.forEach(eachfield => {
    if(eachfield.get('start_ip').value != "" && eachfield.get('end_ip').value == ""){
      console.log("coming inside end_ip is empty");
      eachfield.get('end_ip').setErrors({'incorrect': true});
      eachfield.get('end_ip').markAsTouched();
    }else if(eachfield.get('end_ip').value != "" && eachfield.get('start_ip').value == ""){
      console.log("coming inside start_ip is empty");
      eachfield.get('start_ip').setErrors({'incorrect': true});
      eachfield.get('start_ip').markAsTouched();
    }else{
      eachfield.get('start_ip').setErrors(null);
      eachfield.get('end_ip').setErrors(null);
    }
  });
  }