标签：nbsp pass ati tor struct math exp custom under
*ngFor, you can pass in any value into your structural directive so that it can render templates based on those values. It‘s crucial to understand how the *directive syntax expands into a <template> and adds a custom @Input based on the syntax you use so that you can use your own data.<h2 *three="let message from messages">{{message.to}} - {{message.message}}</h2>
For template it would looks like:
<template [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, two, 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
标签：nbsp pass ati tor struct math exp custom under
原文地址：http://www.cnblogs.com/Answer1215/p/6290872.html
