We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to get the index when using <ng-template>?


I'm using the ListView template as shown in the docs. I get the data via let-data but I haven't found a way to get hold of the index, first and last properties which are available when using ngFor.

I also haven't found anything in the documentation. How can I get these values (index, first, last)?



1 Reply

VK Vinoth Kumar Sundara Moorthy Syncfusion Team September 10, 2019 12:00 PM UTC

Hi Paul, 
Thank you for contacting Syncfusion support. 
We have checked your requirement and currently in ListView, Template is not using ngFor to generate its items. Since it is a custom compiler template, we have generated the items based on the given Values. We suggest you use below workaround solution for your requirement by using below response, 
Code Example 
<span class="e-list-item-header">index {{this.getIndex(data)}} - {{data.text}}</span> 
getIndex(ds) { 
    return this.data.indexOf(ds); 
getFirstElement() { 
    return this.data[0]; 
getLastElement() { 
    return this.data[this.data.length - 1]; 
In ListView the data source is returned in array format so you can get first and last items data by passing first and last index position (0 and data.length-1) to data Source, and you can get the list item index position by passing the item data to indexOf method. 
Could you please check the above sample and get back to us if you need any further assistance on this? 
Vinoth Kumar S 

Live Chat Icon For mobile
Up arrow icon