How to access the item context inside RadListView tkListItemSwipeTemplate


Using NativeScript 3 + Angular 5.

I need to allow the user to swipe an item within a RadListView to reveal a short description about the item.

        <ng-template tkListItemTemplate let-item="item">
            <VideoComponent ="item"></VideoComponent>
        <ng-template tkListItemSwipeTemplate let-item="item">
            <GridLayout columns="*, 500" class="gridLayoutLayout">
                <StackLayout id="short-desc" col="1">
                    <Label [text]="item.shortDescription" class="body" verticalAlignment="center" horizontalAlignment="center"></Label>

I would like to be able to access the current item inside the tkListItemSwipeTemplate so that I can bind the text property of the label to the short description. Currently I am getting the following error

JS: ERROR TypeError: Cannot read property 'shortDescription' of undefined


I know this question is a little old now, but for anyone who comes here looking for an answer, I have managed to work-around this problem. Bind your label text to a different value i.e.:

<Label [text]="myLabelText"...

Then in your onSwipeCellStarted callback, you can use the index property on the ListViewEventData argument and set ‘myLabelText’ appropriately e.g.:

onSwipeCellStarted(args: ListViewEventData) {
   this.myLabelText = featuredVideos[args.index].shortDescription;

This should get you out of trouble. Hope it helps 🙂

Answered By – SeanStanden

Answer Checked By – Marie Seifert (AngularFixing Admin)

Leave a Reply

Your email address will not be published.