首页 > 代码库 > [Angular2] Build reuseable template with ngTemplateOutlet

[Angular2] Build reuseable template with ngTemplateOutlet

We can build a template, use this template and pass in different context to make it reuseable:

<template #foo let-name="name" let-skills="skills">  <h4>{{name}}</h4>  <ul>    <li *ngFor="let s of skills">{{s}}</li>  </ul></template><div [ngTemplateOutlet]="foo"          [ngOutletContext]="msg1"></div><div [ngTemplateOutlet]="foo"          [ngOutletContext]="msg2"></div>
  msg1;  msg2;  constructor() {    this.msg1 = {      name: "Zhentian",      skills: ["JS", "Angular"]    };    this.msg2 = {      name: "Wan",      skills: ["JSX", "React"]    };  }

技术分享

[Angular2] Build reuseable template with ngTemplateOutlet