Angular 反应形式：如何改变发送到后端的数据

Question

例如，我有一个在 React 上似乎相对容易解决的问题，但在 Angular 中却不是那么简单。

假设我有一个表格

submitForm = this.myform.group({

  fname: ['', Validators.required],
  lname: ['', Validators.required],

  group: [''],
  membershipid: ['', Validators.required],

  personal: this.myform.group({
    age: ['', Validators.required],
    maritalStatus: ['', Validators.required],
    courtRecordsExist: ['', Validators.required],
  }),

})

到目前为止，一切都很简单。但是，要将其发送到后端，我需要将其格式化为复杂的所需接口，例如：

{
  fname: '',
  lname: '',

  one: {
    professional: {
      data: ['group', 'membershipid']
    }
  },

  two: {
    personalData: {
      age: '',
      maritalStatus: '',
      courtRecordsExist: '',
    }
  }
}

Answer 1

变量

apiObject

就是你所需要的

    let formValue = this.myform.value;
    let apiObject = {
      fname: formValue.fname,
      lname: formValue.lname,
      one: {
        professional: {
          data: [formValue.group, formValue.membershipid]
        },
      two: {
        personalData: {
          ...fromValue.personal
        }
      }
      }
    }
  };