首页 > 解决方案 > Nativescript + Angular:iOS模拟器多次触发点击事件

问题描述

当我在我的 iOS 模拟器上运行以下代码时,该onTap()方法被调用了两次。在我的物理 iPhone 上运行的完全相同的代码onTap()只被调用一次。我知道它的代码相同,因为tns run ios同时部署到两者。

home.component.html

<ActionBar title="Home" class="action-bar" visability="collapsed"></ActionBar>

<FlexboxLayout flexDirection="column" justifyContent="center" alignItems="center">
    <Button (tap)="onTap($event)" class="fas btn btn-primary" text="Test"></Button>
</FlexboxLayout>

home.component.ts

import { Component, OnInit } from '@angular/core';
import { Page } from 'ui/page';

@Component({
  selector: 'home',
  moduleId: module.id,
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
  counter = 0;
  constructor(private _page: Page) {}

  ngOnInit(): void {
    this._page.actionBarHidden = true;
  }

  onTap(args) {
    this.counter++;
    console.log('Tapped ' + this.counter + ' times!');
  }
}

当我按下模拟器上的按钮时,我得到(注意计数器不增加):

CONSOLE LOG file:///app/app/home/home.component.js:15:20: Tapped 1 times!
CONSOLE LOG file:///app/app/home/home.component.js:15:20: Tapped 1 times!

相同的代码,在物理 iPhone 上我得到:

CONSOLE LOG file:///app/app/home/home.component.js:15:20: Tapped 1 times!

应用程序路由.module.ts

const routes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent },
  {
    path: 'test',
    loadChildren: '~/app/test/test.module#TestModule',
    data: {
      title: 'Test'
    }
  }
];

@NgModule({
  imports: [NativeScriptRouterModule.forRoot(routes)],
  exports: [NativeScriptRouterModule]
})
export class AppRoutingModule {}

包.json

"dependencies": {
    "@angular/animations": "~7.1.0",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/forms": "~7.1.0",
    "@angular/http": "~7.1.0",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "nativescript-angular": "~7.1.0",
    "nativescript-ngx-fonticon": "~4.2.0",
    "nativescript-orientation": "~2.2.1",
    "nativescript-sqlite": "~2.2.6",
    "nativescript-theme-core": "~1.0.4",
    "nativescript-ui-chart": "~3.11.1",
    "nativescript-ui-listview": "~5.1.0",
    "reflect-metadata": "~0.1.8",
    "rxjs": "~6.3.0",
    "tns-core-modules": "~5.1.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~7.1.0",
    "@nativescript/schematics": "~0.5.0",
    "@ngtools/webpack": "~7.1.0",
    "codelyzer": "~4.5.0",
    "nativescript": "~5.1.0",
    "nativescript-dev-sass": "~1.6.0",
    "nativescript-dev-typescript": "~0.7.0",
    "nativescript-dev-webpack": "~0.19.0",
    "tslint": "~5.11.0"
  },

我尝试过的事情:

有任何想法吗?

标签: nativescriptangular2-nativescriptnativescript-telerik-ui

解决方案


这与文件观察器有关。它运行的两个实例在设备上部署相同的应用程序 2x。很难解释。

Hardware > Erase all content and settings..,杀了我的终端,打开一个新的然后跑了tns run ios


推荐阅读