[Angular Directive] Assign a structual Directive a Dynamic Context in Angular 2

 Just like passing in a array to *ngFor, you can pass in any value into the your structural directive so the it can render templates based on those values. It ' s crucial to understand how the *directiveSyntax expands into a <template>and adds a custom @InputBased on the syntax, you can use your own data. The syntax looks like:

<*three= "Let message from Messages">{{message.to}}-{{ Message.message}}</h2>

For template It would looks like:

<[Threefrom]= "Messages"></template> 

It Combimes ' three ' and ' from ' keywords.

So the directive would looks like:

Import {Directive, Input, Templateref, viewcontainerref} from "@angular/core"; @Directive ({selector:' [Three] '}) Export class Threedirective {@Input () set Threefrom({One, one, one, three}) { This. View.createembeddedview ( This. Template, {$implicit: {to:"People" +math.random (), Message:two}});  This. View.createembeddedview ( This. Template, {$implicit: {to:"People" +math.random (), Message:three}});  This. View.createembeddedview ( This. Template, {$implicit: {to:"People" +math.random (), Message:one}}); } constructor (Private Template:templateref<any>, Private View:viewcontainerref) {  }}

[Angular Directive] Assign a structual Directive a Dynamic Context in Angular 2