How to access the item context inside RadListView tkListItemSwipeTemplate

Question

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.

<RadListView 
        [items]="featuredVideos"
        pullToRefresh="true" 
        selectionBehavior="None"
        (itemSwipeProgressStarted)="onSwipeCellStarted($event)" 
        swipeActions="true" 
        (pullToRefreshInitiated)="onPullToRefreshInitiated($event)">
        <ng-template tkListItemTemplate let-item="item">
            <VideoComponent [video]="item"></VideoComponent>
        </ng-template>
        <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>
                </StackLayout>
            </GridLayout>
        </ng-template>
    </RadListView

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

Answer 1

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 :)