angular - Angular2 - Get Name When Using Dynamic Component Loader Wrapper To Display List of Components -

i'm using dynamic component loader display list of components *ngfor:

<div [dragula]='"bag-one"' [dragulamodel]='types'>   <div *ngfor="let component of types; let = index">     <dcl-wrapper [type]="component" [index]="i"></dcl-wrapper>   </div> </div> 

with types being array: types = [ testacomponent, testbcomponent, testccomponent];

within dcl-wrapper component have been able access index of components cannot figure out how output name of components. used this plnkr this question example if want code, relevant code part looks this:

export class dclwrappercomponent {    @viewchild('target', {read: viewcontainerref}) target;   @input() type;   @input()     set name(component: string){       this.name = component;     }   @input()      set index(i: number){       this._index = i;       console.log("item index changed: ", this._index, this.name);     } 

...

and get:

item index changed:  0 undefined item index changed:  1 undefined item index changed:  2 undefined 

could explain i'm going wrong? or if know of better way name/id/whatever of component being moved love hear it.

so figured out appreciate , feedback if i'm following best practices.

first added componentname input components going displayed d.c.l. this:

@input() componentname = 'whatevercomponentnamehere'; 

and added factory additional property each instance this:

let factory = this.componentfactoryresolver.resolvecomponentfactory(this.type); this.cmpref = this.target.createcomponent(factory)  console.log(this.cmpref.instance.componentname + ": " + this._index); ^^^can access this.  this.cdref.detectchanges();