|
[index.html]
<script id="template" type="text/x-jsrender">
<div class="cont-bg">
<div class="{{>Class}}">
</div>
<div class="listrightdiv">
<span class="templatetext">{{>Name}}</span> <span class="designationstyle">{{>Designation}}</span>
<div class="aboutstyle">
{{>About}}
</div>
</div>
</div>
</script>
[app.component.html]
<div style="margin-top:20px;margin-left:10px;">
<ej-listview [dataSource]="data" renderTemplate="true" templateId="template">
</ej-listview>
</div>
[app.component.ts]
export class AppComponent {
data: any;
constructor() {
this.data = [{ "Name": "Brooke", "Class": "brooke", "Designation": "HR Assistant", "About": "Brooke provides administrative support to the HR office." },
{ "Name": "Claire", "Class": "claire", "Designation": "HR Manager", "About": "Claire is responsible for strategic HR planning and budget." },
{ "Name": "Erik", "Class": "erik", "Designation": "Training Specialist", "About": "Erik notifies attendees and manages follow up." },
{ "Name": "Grace", "Class": "grace", "Designation": "Development Manager", "About": "Grace maintains training plans to achive workforce skill." },
{ "Name": "Jacob", "Class": "jacob", "Designation": "Recruitment Manager", "About": "Jacob manages recruitment and prepares key staffing metrics." }];
}
} | 
