在IONIC+Angular中使用hammer.js

听说angular2 对于hammerjs支持很好...

1. 在package.json 加入

  "hammer-timejs": "^1.1.0",
  "hammer-touchemulator": "0.0.2",
  "hammerjs": "^2.0.8"

2. 在devDependencies中加入

 "@types/hammerjs": "^2.0.34"

3.在app.module.ts中加入

 import { HammerGestureConfig, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
 export class MyHammerConfig extends HammerGestureConfig  {
    overrides = <any>{
       // override hammerjs default configuration
       'pan': {threshold: 5},
       'swipe': {
          velocity: 0.4,
          threshold: 20,
          direction: 31 
       },
      'press':{}
   }
 }

4.在app.module.ts的@NgModule的providers中加入

  { 
     provide: HAMMER_GESTURE_CONFIG, 
     useClass: MyHammerConfig 
  }

5.在DOM 元素上使用标签

  <ion-item  (press)="pressIt()"></ion-item>
  在对应的Component中加入pressIt这个方法即可;

备注:我的项目是参考 https://github.com/ionic-team/ionic-conference-app