1

I have 2 components: parentComponent and childComponent. In parentComponent I have a FormGroup type value as parentForm that is passed to childComponent via @input:

export class parentComponent {
...

 parentForm: FormGroup;

....
}

export class childComponent {
...

 @Input()
 childForm :FormGroup; //The parentForm 

....
}

when I run these codes everything is ok and my childComponent recognize the childForm which is an input value from parentComponent but whenever I change some properties in parentForm in parentComponent the childComponent is not able to be aware of these changes and when I debug my codes I see that the childComponent holds old input value and the changes is not updated in childForm in childComponent. now I seek to find a way to pass the reference of parentForm to solve my problem. because I think by this way any change in the parentForm will inform childForm immediately. I do not know how it is possible. (the version of Angular is 5.0.1)

JTejedor
  • 1,082
  • 10
  • 24
helenDeveloper
  • 624
  • 3
  • 8
  • 15
  • 1
    https://stackblitz.com/edit/angular-lk4j8t : I don't know what behavior you're looking for but I definitely get the changes to the `childForm` as well. Take a look at this stackblitz. You can try do `this.childForm.valueChanges` on your `childComponent` as well. – Chau Tran Dec 22 '17 at 23:33

1 Answers1

0

In essence, this question is very related with this question and this another question.

To solve your problem, I suggest this approach:

  • Fill an object using using your form group with the directive NgModel.
  • Change @Input() childForm :FormGroup for @Input() childForm : Object being Object the filled object class using NgModel
  • If Object is not a primitive value string,boolean, num, it will be passed by reference so you will have the updated value immediately.
JTejedor
  • 1,082
  • 10
  • 24