4,500
edits
add multiple items |
add sort functionality |
||
Line 265: | Line 265: | ||
bootstrap(TrainerApp); | bootstrap(TrainerApp); | ||
</syntaxhighlight> | |||
---- | |||
Add sorting functionality. | |||
<syntaxhighlight lang="javascript"> | |||
({ | |||
` | |||
... | |||
<div class="ui grid posts"> | |||
<trainer-item *ngFor="#res_item of sortedResources()" [resource]="res_item"></trainer-item> | |||
</div> | |||
` | |||
}) | |||
class TrainerApp { | |||
resources: Resource[]; | |||
constructor() { | |||
this.resources = [ | |||
new Resource('Chapter 1','Angular 2','http://angular.io','3',10), | |||
new Resource('Chapter 2','Angular 2','http://angular.io','3',10), | |||
new Resource('Chapter 3','Angular 2','http://angular.io','3',10), | |||
]; | |||
} | |||
addResource(title: HTMLInputElement, category: HTMLInputElement, link: HTMLInputElement, credit: HTMLInputElement): void { | |||
console.log(`Adding resource -- title: ${title.value}, category: ${category.value}, link: ${link.value}, credit: ${credit.value}`); | |||
this.resources.push(new Resource(title.value,category.value,link.value,credit.value)); | |||
title.value = category.value = link.value = credit.value = ''; | |||
} | |||
sortedResources(): Resource[] { | |||
return this.resources.sort((a: Resource, b: Resource) => b.credit - a.credit); | |||
} | |||
} | |||
</syntaxhighlight> | </syntaxhighlight> |