如何将数组修补到formarray

问题描述

 this.formgroup = formbuilder.group({
      ordering_data: formgroup.array([this.createOrder()]),});

  createOrder(): FormGroup {
    return this.fb.group({
      order: [null,[Validators.required]],section_menu_id: [null,});
  }

Api结果

[
  {
    "order": 0,"section_menu_id": 3
  },{
    "order": 1,"section_menu_id": 1
  },{
    "order": 2,"section_menu_id": 6
  },]

我尝试在表单输入中显示来自api结果的所有那些数据。 有人可以告诉我如何将api结果修补到formgroup中。预先感谢

解决方法

在我的项目中，我做这样的事情：

const data = [
  {
    "order": 0,"section_menu_id": 3
  },{
    "order": 1,"section_menu_id": 1
  },{
    "order": 2,"section_menu_id": 6
  },];

constructor(private fb: FormBuilder) {}

ngOnInit() {
  this.formgroup = this.fb.group({
    ordering_data: this.fb.array(this.data.map(item => this.createOrder(item))),});
}

createOrder(item?: any): FormGroup {
  return this.fb.group({
    order: [item ? item.order : null,Validators.required],section_menu_id: [item ? item.section_menu_id : null,});
}

,

您尝试过以下吗？

this.formGroup.controls.ordering_data.patchValue(apiResult);

无法在本地对其进行测试。也许您可以提供堆叠闪电战？

,

请考虑以下内容，但我没有对其进行测试；

interface Order {
  order: number;
  section_menu_id: number;
}

ngOnInit() {
  this.formgroup = formbuilder.group({
     ordering_data: formgroup.array([]),});
}

createOrder(o: Order): FormGroup {
  return this.fb.group({
     order: [o.order,[Validators.required]],section_menu_id: [o.section_menu_id,});
}

getOrders() {
   this.http.get(url).subscribe(ordersResponse: Order[]) => {
     const ordering_data = this.formgroup.get('ordering_data') as FormArray;
     ordersResponse.forEach((o: Order) => {
        ordering_data.push(this.createOrder(o.order,o.section_menu_id));
     }

     this.formgroup.updateValueAnDValidity();
   });
}