angular - Not able to bind json data to dynamically loaded child component -

i trying dynamically load child component parent component. parent component need pass parameter child used in child component make service call , retrieve data webapi service. returned data should bound input controls in child component.

for testing purpose have created plunker wherein loading child component parent , trying bind input controls data json object have initialized locally. facing issues here, data not getting bound here properly.

plunker url

my child component code

import {component, input} '@angular/core' import { form_directives } '@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:`<h1>this loader</h1>   <input type="text" [(ngmodel)]="resultdata.queueid" />    ` }) export class loader{     @input() parentid : any;     // resultdata : any;     resultdata = sample;     constructor()     {       } }   export class sample {     queueid: number;     name: string; } 

isn't resultdata sample[] , template expecting sample. update template such sample e.g.

<input type="text" [(ngmodel)]="resultdata[0].queue.id />