Angular Form的FormArray 和 FormGroup操作 （实用、备忘、赞）

1、Angular学习笔记45：响应式表单-FormArray & 动态的增加、减少FormArray中的元素 & 给FormArray 赋值

2、Angular学习笔记48：响应式表单-FormArray 和 FormGroup的多层嵌套
 

博主网址：https://me.csdn.net/wjyyhhxit  （值得关注）

 

3、angular6.x 动态表单 FormArrayName （经实践多层嵌套可用, 推荐！推荐！推荐！）

4、[Angular]——创建表单之FormArray、FormGroup (动态定义表单的属性，推荐！）
【静态定义表单】

        this.form = this.fb.group({
            ID: [""],
            ItemNo: ["", Validators.required],
            ItemName: ["", Validators.required],
            Remark: [""],
            ItemSpecs: this.fb.array([
                new FormGroup({
                    ID: new FormControl(null),
                    ItemID: new FormControl(null),
                    IndexNo: new FormControl(null),
                    SpecName: new FormControl(null),
                    StdPrice: new FormControl(null),
                }),
            ]),
        });

【动态定义表单】
 

        this.form = this.fb.group({
            ID: [""],
            ItemNo: ["", Validators.required],
            ItemName: ["", Validators.required],
            Remark: [""],
            ItemSpecs: this.fb.array([]),
        });
        
        // 动态设置定段
        let itemSpecs = this.form.controls["ItemSpecs"] as FormArray;
        let aSpec = new FormGroup({});
        aSpec.addControl('ID', new FormControl(null));
        aSpec.addControl('ItemID', new FormControl(null));
        aSpec.addControl('IndexNo', new FormControl(null));
        aSpec.addControl('SpecName', new FormControl(null));
        aSpec.addControl('StdPrice', new FormControl(null));
        itemSpecs.push(aSpec);