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"] }; }
时间: 2024-11-06 05:42:26