Блог

Я использую reactive forms и имею внутри массивы форм. Один компонент сохраняет значения в базе данных, и теперь у меня есть другой компонент для редактирования этих значений и их обновления. но я не могу разобраться с массивами форм, потому что я не могу извлечь их в поля formarray. в нем говорится, что ForEach не существует в {} . Что может быть не так? Вот мой код.

edit.component.ts

 ngOnInit() {
    this.requestID = this.route.snapshot.params.requestID;
    this.formService.getFormDetails(this.formID).subscribe((data: any) => {
          data.forEach(customer => {
            if (customer) {
              this.customerFormEdit.patchValue({
                requestID: customer.requestID,
                requestType: customer.requestInformation.requestType,
                specialRequest: customer.specialRequest,
                sendTo_email: customer.requestInformation.sendTo.email
    // I know patch values is used to patch normal fields
    });
this.getEquip()
}
 getEquip() {
    const control = <FormArray>this.customerFormEdit.controls['equipment'];
    this.customers.equipment.forEach(x => {
      control.push(this.fb.group({ SerialNo: x.serialNo }))
    })
  }
  

вот как выглядит модель моих клиентов

 export class CustomerForm {
  company: string;
  attention: string;
  email: string;
  requestType: string;
  specialRequest:string
  equipment: {
    serialNo: string;
    customerID: string;
  };
}
  

и вот как массив формы хранится в JSON

 "installations" : [ 
        {
            "_id" : ObjectId("5cb54f48c39990305c8e026e"),
            "customerSerialNo" : "273823",
            "customerID" : "32324",
}]
  

// fb Array

 equipment:this.fb.array([this.fb.group({
serialNo:"",
customerID:""
})])
  

Вы объявили оборудование как объект внутри модели, тогда как оно должно быть массивом.

Ваша модель должна быть разделена как,

 export class CustomerForm {
  company: string;
  attention: string;
  email: string;
  requestType: string;
  specialRequest:string
  equipment[];
}


export class equipment{
  serialNo: string;
  customerID: string;
}