1

I'm trying to set to a child component a parentFromGroup as @Input and I am getting famous error,

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'ng-untouched: true'. Current value: 'ng-untouched: false'.

I know this error but here I don't understand why, because I set value from parent to child not inverse. You can check it here

If you click "Add article" button then try to write to added field, angular will trow error.

What is the best way to achieve what I'm trying here ?

Sudarshana Dayananda
  • 5,165
  • 2
  • 23
  • 45
ebeg
  • 418
  • 1
  • 4
  • 17
  • Possible duplicate of [How to manage Angular2 "expression has changed after it was checked" exception when a component property depends on current datetime](https://stackoverflow.com/questions/39787038/how-to-manage-angular2-expression-has-changed-after-it-was-checked-exception-w) – Kamil Naja Jul 19 '19 at 18:28
  • 1
    it is same error but completly different subject (there are a lot way to get this error) – ebeg Jul 19 '19 at 18:33

1 Answers1

0

You can fix this error using detectChanges() from ChangeDetectorRef on input filed (input) event as follows.

HTML

<input placeholder="designation" (input)="onInputChange()" formControlName="designation">

TS

import { ChangeDetectorRef } from '@angular/core';

 constructor(private cd: ChangeDetectorRef) {}

  onInputChange() {
    this.cd.detectChanges();
  }

StackBlitz Demo.

Sudarshana Dayananda
  • 5,165
  • 2
  • 23
  • 45
  • Thank you, i don’t like this solution this is pretty big form. I need bind parentForm in a proper way to child components, im looking right way. – ebeg Jul 19 '19 at 18:49
  • I heard ControlContainer is maybe the solution without providing @Input but i never used it before, if someone can help thanks – ebeg Jul 19 '19 at 19:35