Not able to bind json data to dynamically loaded child component
<p>I am trying to dynamically load a child component from the parent component. From the parent component I need to pass some parameter to the child which would be used in the child component to make a service call and retrieve some data from WebAPI Service. the returned data should be bound to some input controls in the child component.</p>

<p>for testing purpose I have created a plunker wherein I am loading a child component from the parent and I am trying to bind the input controls data from the JSON object which i have initialized locally. I am facing some issues here, the data is not getting bound here properly. </p>

<p><a href="https://plnkr.co/edit/xROfBv?p=preview" rel="nofollow">Plunker</a> URL</p>

<p>my child component code</p>

<pre><code>import {Component, Input} from '@angular/core'
import { FORM_DIRECTIVES } from '@angular/common';

const SAMPLE: Sample[] = [
    { queueId: 11, name: 'Mr. Nice' },
    { queueId: 12, name: 'Narco' },
    { queueId: 19, name: 'Magma' },
    { queueId: 20, name: 'Tornado' }
];

@Component({
  selector: 'load',
  directives: [FORM_DIRECTIVES],
  template:`&lt;h1&gt;This is from loader&lt;/h1&gt;
  &lt;input type="text" [(ngModel)]="resultData.queueId" /&gt;

  `
})
export class Loader{
    @Input() ParentID : any; 
   // resultData : any;
    resultData = SAMPLE;
    constructor()
    {


    }
}


export class Sample {
    queueId: number;
    name: string;
}
</code></pre>