title: Subscribe to changes in parent component in Angular
body: <p>I've a parent component which hosts a list of child components. This children are create dynamically and can be of any type.</p>
  
  <p>So, what I'm doing is using an <code>ng-container</code> as host in the parent component, create the child components with <code>ComponentFactoryResolver</code> and then update some properties in the child component using ```(component.instance as any).id = host.id;````</p>
  
  <p>Here is the code for parent component (it's a table with some rows):</p>
  
  <pre><code>&lt;tr class="table-collapse__item" [class.active]="company === selected"&gt;
    &lt;td [attr.colspan]="getItemColspan()"&gt;
      &lt;ng-container host [id]="name" [selected]="isSelected"&gt;&lt;/ng-container&gt;
    &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p><code>host</code> is a directive</p>
  
  <pre><code>@Directive({
    selector: '[host]'
  })
  export class Host implements OnChanges {
    @Input() id: any;
    @Input() selected: boolean;
    constructor(public viewRef: ViewContainerRef) {}
  }
  </code></pre>
  
  <p>and finally how to create the components and update the properties</p>
  
  <pre><code>@ViewChildren(Host) hosts: QueryList&lt;Host&gt;;
  
    constructor(private resolver: ComponentFactoryResolver,
                private cd: ChangeDetectorRef) {}
  
    ngAfterViewInit() {
      if (this.hosts) {
        const componentFactory = this.resolver.resolveComponentFactory(this.inner);
        this.hosts.forEach((host: Host) =&gt; {
          const component = host.viewRef.createComponent(componentFactory);
          (component.instance as any).id = host.id;
          (component.instance as any).selected = host.selected;
        });
        this.cd.detectChanges();
      }
    }
  </code></pre>
  
  <p>Now, my question. I need the child component to react to changes in its properties, but as its properies are not Inputs but just basic properties, I can´t use ngOnChanges inside the childComponent. So it's there a way I can subscribe from the child component to changes in the parent component?</p>
  
  <p>I can use ngOnChanges in the Host directive and update the properties in the component, but how to then trigger some code in the child component?</p>
  
  <p>I have a <a href="https://plnkr.co/edit/JIPM6mRYp3Lf0XtpxyBH?p=preview" rel="noreferrer">plunker</a> to test it. When clicking on data1, data2, data3 or data4, the row below should collapse or expande.</p>
  
  <p>Thanks.</p>