CODEWITHSUNDEEP
angularangular-formsangular-reactive-forms
Joseph
Joseph

Reputation: 7785

Combining Values of an Array into FormArray Rows in Reactive Forms

I'm trying to submit a product and i need to get also the this.totals[].amount and this.totals[].total. Right now, i can only get the this.myForm.get('rows').value. I need to insert in the rows the this.totals[].amount and this.totals[].total. How can i do this? Here's the link to my code

CLICK LINK HERE

onCreateProduct(){
   const formData = {
     products: this.myForm.get('rows').value
   }
   console.log(formData)

  }

patchValues() {
    let rows = this.myForm.get('rows') as FormArray;
    this.orders.forEach(material => {
      material.materials.forEach(x => {
        rows.push(this.fb.group({
          material_id: x.id,
          material_name: x.name,
          quantity: [null, Validators.required],
          price: [null, Validators.required],
          dis_checkbox: [true],
          checkbox: [1.12]
        })) //see that total and amount is NOT in the form
        this.totals.push({amount:0,total:0});  //<--add this line
      })
    })
    this.setOnChange();
  }

Upvotes: 0

Views: 669

Answers (1)

Adam Keenan
Adam Keenan

Reputation: 784

You can easily add data to your rows on submit in your onCreateProduct function. Change the code to the following:

const formData = {
  products: this.myForm.get('rows').value.map((row, i) => {
    row.amount = this.totals[i].amount;
    row.total = this.totals[i].total;
    return row;
  })
}

Upvotes: 2

Related Questions