Question

这是我第一次尝试使用离子2.但我已经遇到了困难。但我正在努力。所以在我开始一个新项目之后，我继续看看如何使用click事件。我在网上搜索和阅读。但仍然没有得到正确答案。

所以我在按钮点击事件中使用了这段代码。

modelBuilder.Entity<Material>().MapToStoredProcedures();

我的.ts文件如下所示。

<button myitem (click)='openFilters()'>CLICK</button>

我尝试将import {Component} from '@angular/core'; import {NavController} from 'ionic-angular'; @Component({ templateUrl: 'build/pages/home/home.html' }) export class HomePage { constructor(private navCtrl: NavController) { openFilters() { console.log('crap'); } } }添加到@component部分。

Answer 1

使用点击功能

您的代码应如下所示

<强> html的

<button myitem (click)='openFilters();'>CLICK</button>

<强> .TS

import {Component} from '@angular/core';
import {NavController} from 'ionic-angular';

@Component({
    templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  constructor(private navCtrl: NavController) {

  }

  openFilters() {
        console.log('crap');
    }
}

Answer 2

button元素中的代码非常完美。问题是您已在类的构造函数中声明了openfilters()方法，因此click事件处理程序找不到它。

将它放在构造函数之外，作为该类的另一种方法，它将按预期工作。

export class HomePage { constructor(private navCtrl: NavController) { // ... } openFilters() { console.log('crap'); } }

Answer 3

点击事件会在iOS设备上造成延迟问题。用户可能需要多次单击该元素以进行离子识别事件。这个问题的原因被称为离子点击阻止器，它阻止任何交互，直到转换完全完成。这是为了识别用户是否想要触摸设备上的点击事件或双击事件。

请参阅 -

处的解决方案

http://www.agiliztech.com/2017/05/29/click-handler-reaction-delay-ionic-2/

Answer 4

@Component({
    templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  constructor(private navCtrl: NavController) {}

openFilters() {
        console.log('crap');
    }
}

将openFilters（）放在构造函数外部。

如何在离子2中正确使用（点击）？

4 个答案: