angular (form array) value changes is not working

Question

Form array value changes is not working. I can't console the value inside subscriber method. Here is my basic form array code below.

ordersData = [
 { id: 100, name: 'order 1' },
 { id: 200, name: 'order 2' },
 { id: 300, name: 'order 3' },
];

this.formGroup = this.formBuilder.group({
      testControl: this.formBuilder.array([])
  });

 get formGroupControl() {
    return (this.formGroup.get('testControl') as FormArray);
  }

 private addFormControl() {
    this.ordersData.forEach((o, i) => {
      (this.formGroup.get('testControl') as FormArray).controls.push(this.formBuilder.control(''));
    });
  }

I've called this addFormControl() function inside the ngOnInit() and if I try to see the valuechanges using this following way

this.formGroup.get('testControl').valueChanges.subscribe(value => {
      console.log('log', {value});
    });

this console is not working.. Walk me through the right way of handling form array

Answer 1

I was having the same problem (I think), forms added to the formArray through formArray.controls.push didn't work, I fixed by using formArray.push instead