如何从 nativescript 中的 ListView 点击事件中获取特定列表项答案

【问题标题】：How can I get an specific list item from ListView tap event in nativescript如何从 nativescript 中的 ListView 点击事件中获取特定列表项
【发布时间】：2018-04-23 13:46:07
【问题描述】：

我正在尝试使用 angular2 + typescript 从点击事件中获取数据：

这是组件 HTML：

<RadListView row="1" [items]="groceryList" [class.visible]="listLoaded" (tap)="seeItem($event)"
    swipeActions="true" (itemSwipeProgressStarted)="onSwipeCellStarted($event)">

    <ng-template let-item="item">
        <Label [text]="item.name" class="p-15 list-item"></Label>
    </ng-template>

    <GridLayout *tkListItemSwipeTemplate columns="*, auto">
        <StackLayout id="delete-view" col="1" (tap)="delete($event)" class="delete-view">
            <Image src="~/images/delete.png"></Image>
        </StackLayout>
    </GridLayout>
</RadListView>

这是组件代码：

seeItem(args: ListViewEventData) {
    console.log('item ', <Grocery>args.object.bindingContext);
    console.log('in case');
}

当我从我的 ListView 中点击一个元素时，我会得到 console.log：

[Eric Guzmán’s iPhone]: item undefined
[Eric Guzmán’s iPhone]: in case

“删除”事件（在此组件中）使用相同的逻辑，当点击时：

delete(args: ListViewEventData) {
        let grocery = <Grocery>args.object.bindingContext;
        this.groceryService.delete(grocery.id)
            .subscribe(() => {
                let index = this.groceryList.indexOf(grocery);
                this.groceryList.splice(index, 1);
            });
    }

我是 NativeScript 的初学者，非常感谢您的帮助，

【问题讨论】：

这在您使用 RadListview 时不起作用，而在杂货店示例中它是 ListView。所以抓住索引var index=args.itemIndex;，然后按该索引过滤数组，即this.groceryList[index];
非常感谢，它成功了。

标签： angular typescript nativescript

【解决方案1】：

如果您希望获得该项目，您需要进行以下更改

替换

<ng-template let-item="item">
        <Label [text]="item.name" class="p-15 list-item"></Label>
</ng-template>

与

<ng-template let-item="item">
        <Label [text]="item.name" (tap)="seeItem(item)" class="p-15 list-item"></Label>
</ng-template>

并在函数中进行修改

seeItem(item: Grocery) {
    console.log('item ', item);
    console.log('in case');
}

试试这个应该可以的。

【讨论】：

这不起作用，因为他想在执行滑动操作时获取项目。