Closed
Description
Add support for item template selector ListView for Angular. Item template selectors will be supported in NativeScript in 2.4.0
release (for reference NativeScript/NativeScript#2820).
Suggested implementation:
- Use
nsTemplateKey
directive to give names to your templates - Provide a template selector function(
itemTemplateSelector
property of theListView
component) that returns the name of the template to be used given the data-item.
Here is how the end result will look like:
HTML:
<ListView [items]="myItems" [itemTemplateSelector]="templateSelector">
<template nsTemplateKey="header" let-item="item">
<header-component [data]="item"></header-component>
</template>
<template nsTemplateKey="item" let-item="item">
<item-component [data]="item"></item-component>
</template>
</ListView>
TS(component code)
@Component({ ... })
class MyComponent {
public myItems: Array<DataItem>;
public templateSelector(item: DataItem, index: number, items: any) : string {
return item.isHeader ? "header" : "item";
}
// ...
}