FormArray：在angular6中找不到具有未指定名称属性的控件答案

【问题标题】：FormArray : Cannot find control with unspecified name attribute in angular6FormArray：在angular6中找不到具有未指定名称属性的控件
【发布时间】：2019-06-17 00:19:01
【问题描述】：

我使用响应式和演示表单创建了一个表单。当我调用提交表单的字段时，这给了我错误。

这个错误：

找不到具有未指定名称属性的控件

    addProductFG:FormGroup;
  cats:Category[];
  subCats:Category[];
  PD:Productdetail[];
  selectedCat:number;
  valueIngrident=new FormArray([]);
  public loading=false;

  constructor(private fb:FormBuilder,private productService:ProductinfoService,private catService:CategoryService) { }

  ngOnInit() {
    this.loading=true;
    this.InitialFrom();
    this.GetMainCat();
  }

  public CreateValueFiled(PD:Productdetail[]){
      PD.map(element => {
        this.valueIngrident.push(
          new FormGroup({
            infoId:new FormControl(element.id),
            value:new FormControl('')
          })
        )
      });
  }

  public GetMainCat(){
    this.catService.GetMainCat().subscribe(
      res=>{
        this.cats=res;
        this.loading=false;
      }
    )
  }

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

  public InitialFrom():FormGroup{

    this.addProductFG=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])],
      values:this.valueIngrident
    })
    return this.addProductFG;
  }
  public ChangeSubCat(id:number){
    this.loading=true;
      this.catService.GetSubCatByCatId(id).subscribe(
          res=>{
            this.subCats=res;
            this.loading=false;
          }
        )
  }

  public ChangeFormByType(id:number){
    this.loading=true;
      this.productService.GetPCIBySubId(id).subscribe(
        res=>{
          this.PD=res,
          this.CreateValueFiled(this.PD),
          this.loading=false;
        }
      )
  }

在 HTML 中：

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

这是我在 stackblitz Demo 中的示例代码

有什么问题？我该如何解决这个问题？

【问题讨论】：

标签： javascript angular typescript formarray

【解决方案1】：

您应该使用formArrayName 而不是formArray：

<div formArrayName="values">

Forked Stackblitz

另外请保持你的变量同步：

AddP: FormGroup; // why upper case?

html

[formGroup]="addP"

Javascript 是区分大小写的语言

【讨论】：