Click here to Skip to main content
15,888,053 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am trying to patch the object received from webapi to an angular reactive form. The form also has a formarray. But, despite having more than 3 or more records only 2 records are being patched to the formarray of the reactive form.


What I have tried:

I have two entities noseries and noseriesList, where a noseries has zero or many noseriesLists. So after obtaining noseries from webapi, i want to patch properties and navigation list "noseriesLists" of noseries into reactive form. Rest of the properties are being patched properly, but only 2 records of navigation list "noseriesLists" is being patched to the formArray nested inside the reactive form.


//initialization of form
    this.noseriesForm = this.fb.group({
      id: [null],
      description: ['', Validators.required],
      code: [ '', Validators.compose([Validators.maxLength(10), Validators.required])],
      noSeriesList: this.fb.array([
         this.initLine(), this.initLine()
      ])
    });

//patching the object received from service to form
 this.route.params.subscribe(routeParam => {
      if (routeParam.id) {
        this.noseriesService.get(routeParam.id)
        .subscribe((data: NoSeries) => {
          this.isCreateMode = false;
          this.noseries = data;
          this.noseriesForm.patchValue(this.noseries);
          console.log(this.noseries, 'data from api');
          console.log(this.noseriesForm.value,'formvalue');
        });
      }

    });



logging the data received from service shows 3 noseriesList records, whereas logging formvalue only shows 2 records of noseriesList.
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900