NativeScript（itemTap）函数不会触发

Question

我创建了一个带有ListView的html页面的简单打字稿组件，我想获取我刚刚在控制台日志中点击的项目，但它甚至在调试时都没有触发事件。使用Android版本7.1.1的模拟器进行测试。

home.component.ts：

import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
import { RouterExtensions } from 'nativescript-angular/router';
import * as LabelModule from "tns-core-modules/ui/label";
var SQLite = require('nativescript-sqlite');


@Component({
    moduleId: module.id,
    selector: 'ns-home',
    templateUrl: 'home.component.html',
    styleUrls: ['home.component.css'],
    changeDetection: ChangeDetectionStrategy.OnPush
})


export class HomeComponent implements OnInit {
    public myItems: Array<any>;
    public database: any;
    public input: any;

    public constructor(private router: RouterExtensions) {
        this.myItems = [];
        (new SQLite('MeasureIt.db')).then(db => {
            db.execSQL('CREATE TABLE IF NOT EXISTS measures (id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT, unit TEXT, today INTEGER, total INTEGER)').then(id=> {
                this.database = db;
                this.fetch();
            }, error => {
                console.log('Create table error', error);
            });
        }, error => {
            console.log('Open db error: ', error);
        });
    }

    public ngOnInit() {
        if (this.myItems.length <= 0) {
            const label = new LabelModule.Label();
            const expectedValue = "No Measures Found!";
            label.text = expectedValue;
        } else {
            console.log("Measures found!");
        }
    }

    public onItemTap(args) {
        console.log("Item Tapped: " + args.index);
    }

    public onPlusTap() {
        this.router.navigate(['/createMeasure']);
    }
    public addMesurement() {
        this.router.navigate(['/newMeasure']);
    }

    public fetch() {
        this.database.all('SELECT * FROM measures').then(rows => {
            this.myItems = [];
            for(let row in rows) {
                this.myItems.push({
                    'id': rows[row][0],
                    'name': rows[row][1],
                    'unit': rows[row][2],
                    'today': rows[row][3],
                    'total': rows[row][4]
                });
            }
        });
    }
}

这是简单的home.component.html：

<ActionBar>
    <ActionItem *ngIf="authentication" text="Logout" ios.position="true" (tap)="logout()"></ActionItem>
    <ActionItem text="Create Measure" ios.position="true" (tap)="onPlusTap()"></ActionItem>
</ActionBar>
<ListView [items]="myItems" (itemTap)="onItemTap($event)">
    <ng-template let-item="item" let-i="index" let-odd="odd" let-even="even">
        <StackLayout [class.odd]="odd" [class.even]="even" orientation="horizontal">
            <Label style="vertical-align: center; text-align: center;" [text]='"ID: " + item.id' width="10%"></Label>
            <Label style="vertical-align: center; text-align: center;" [text]='item.name' width="20%"></Label>
            <Label style="vertical-align: center; text-align: center;" [text]='"Today: " + item.today + item.unit' width="28.5%"></Label>
            <Label style="vertical-align: center; text-align: center;" [text]='"Total: " + item.total + item.unit' width="28.5%"></Label>
            <Button text="+" (tap)="addMesurement($event)" width="13%" ></Button>
        </StackLayout>
    </ng-template>
</ListView>

Answer 1

我使用最新版本的{N}测试了您的代码，itemTap中的ListView正常工作。

相关的package.json内容：

"nativescript": {
  "tns-android": {
    "version": "3.4.1"
  }
},
"dependencies": {
  "@angular/animations": "~5.2.0",
  "@angular/common": "~5.2.0",
  "@angular/compiler": "~5.2.0",
  "@angular/core": "~5.2.0",
  "@angular/forms": "~5.2.0",
  "@angular/http": "~5.2.0",
  "@angular/platform-browser": "~5.2.0",
  "@angular/platform-browser-dynamic": "~5.2.0",
  "@angular/router": "~5.2.0",
  "nativescript-angular": "~5.2.0",
  "nativescript-theme-core": "~1.0.4",
  "reflect-metadata": "~0.1.8",
  "rxjs": "~5.5.2",
  "tns-core-modules": "~3.4.0",
  "zone.js": "~0.8.18"
},
"devDependencies": {
  "babel-traverse": "6.26.0",
  "babel-types": "6.26.0",
  "babylon": "6.18.0",
  "lazy": "1.0.11",
  "nativescript-dev-typescript": "~0.6.0",
  "typescript": "~2.6.2"
}