我需要转换我的 formGroup 中的一个 formarray

Question

这是我的 ngOnInit

 ngOnInit() {
      this.formGroup = this._formBuilder.group({
        
        basic: this._formBuilder.array([this.basicGroup()]),
        experience: this._formBuilder.array([this.experienceGroup()]),
        education: this._formBuilder.array([this.educationGroup()]),
        skills: this._formBuilder.array([this.skillsGroup()]),
        contact: this._formBuilder.array([this.contactGroup()]),
        summary: this._formBuilder.array([this.summaryGroup()]),

      });

然后我将表单组的值传递给参数并在控制台上打印它。

提交表单后，在我的控制台中得到这样的表单值。

{
basic:[{...}]
experience:[{...}]
education:[{...}]
skills:[{...}]
contact:[{...}]
summury:[{...}]
}

我需要提取基本数组中的值，当我控制参数值时，表单组中的值应该是这样的


{
profile_name: value
country_id: value
and all other fields in basic
experience:[{...}]
education:[{...}]
skills:[{...}]
contact:[{...}]
summury:[{...}]
}

我的基本表单数组如下所示

 basicGroup(): FormGroup{
      return this._formBuilder.group({
        profile_name: ['', [Validators.required]],
        country_id: ['', [Validators.required]],
        address: ['', [Validators.required]],
        years_of_experience: ['', [Validators.required]],
        cell_phone: ['', [Validators.required, Validators.pattern("^((\+91-?)|0)?[0-9]{10}$")]],
        main_phone: ['', [Validators.pattern("^((\+91-?)|0)?[0-9]{10}$")]],
      })
    }

我该如何解决这个问题？

Answer 1

您可以直接为 basicGroup 的每个单独项目添加 formControls，而不是将 basicGroup 添加为 formArray。例如：

this.formGroup = this._formBuilder.group({
        
    profile_name: ['', [Validators.required]],
    country_id: ['', [Validators.required]],
    address: ['', [Validators.required]],
    years_of_experience: ['', [Validators.required]],
    cell_phone: ['', [Validators.required, Validators.pattern("^((\+91-?)|0)?[0-9]{10}$")]],
    main_phone: ['', [Validators.pattern("^((\+91-?)|0)?[0-9]{10}$")]],
    experience: this._formBuilder.array([this.experienceGroup()]),
    education: this._formBuilder.array([this.educationGroup()]),
    skills: this._formBuilder.array([this.skillsGroup()]),
    contact: this._formBuilder.array([this.contactGroup()]),
    summary: this._formBuilder.array([this.summaryGroup()]),

  });

其他

尝试将 basicGroup 作为子 formGroup。

basicGroup: this._formBuilder.group({
        profile_name: ['', [Validators.required]],
        country_id: ['', [Validators.required]],
        address: ['', [Validators.required]],
        years_of_experience: ['', [Validators.required]],
        cell_phone: ['', [Validators.required, Validators.pattern("^((\+91-?)|0)?[0-9]{10}$")]],
        main_phone: ['', [Validators.pattern("^((\+91-?)|0)?[0-9]{10}$")]]
    })

在将其发布到后端之前，通过这样的映射器函数传递它：

mapper(){
   let formattedOutput = {...this.formGroup.value};
   delete formattedOutput.basicGroup;
   formattedOutput = {
      ...formattedOutput, 
      ...this.formGroup.get('basicGroup').value
   }
   return formattedOutput;
}

我需要转换我的 formGroup 中的一个 formarray

I need to convert one of the form arrray in my formGroup

angular

angular-forms

angular-formbuilder

angular-arrays