what is the correct way for a dynamically created component to know about the change of some input property?

Issue

I am creating a component dynamically and I am passing the value to an input defined in the created component. Like this

componentRef = viewContainerRef.createComponent<ChildComponent(ChildComponent);
componentRef.instance.organization = this.selectedOrganization;

The child component looks like this

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.scss'],
})
export class ChildComponent implements OnInit, OnChanges {
  @Input() organization?: OrganizationModel;

  constructor() {}

  ngOnInit(): void {
    console.log(this.organization);
  }

  ngOnChanges(changes: SimpleChanges): void {
    console.log(changes);
  }
}

This is working fine. But I require the child component to know when the value of the selectedOrganization property in the parent has changed.

what is the correct way for a dynamically created component to know about the change of some input property?

Thanks in advance

Solution

You can use a "getter" in your parent

componentRef:any;
_organization:any;
get organization()
{
    return this._organization
}
set organization(value)
{
   this._organization=value;
   if (this.componentRef)
      componentRef.instance.organization=value
}

Answered By - Eliseo