应用程序将无法在Angular 9中使用Hammer.JS和HammerGestureConfig识别刷卡

Question

我无法使用Hammer.JS在Angular应用中识别滑动。设置如下：

"@angular/core": "~9.0.0-next.6",
"hammerjs": "^2.0.8",
"zone.js": "~0.10.2"

app.module.ts看起来像这样：

import { BrowserModule, HammerGestureConfig, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
import * as hammer from 'hammerjs';

export class MyHammerConfig extends HammerGestureConfig {
  overrides = <any>{
    swipe: { direction: hammer.DIRECTION_HORIZONTAL },
    pinch: { enable: false },
    rotate: { enable: false }
  };
}

@NgModule({
  imports: [
    BrowserModule,
  ],
  providers: [
    {
      provide: HAMMER_GESTURE_CONFIG,
      useClass: MyHammerConfig
    }
  ],
})

app.component.ts具有此方法：

onSwipe() {
  console.log('swipe');
}

和结局app.component.html看起来像这样：

<div (swipeleft)="onSwipe()" (swiperight)="onSwipe()">
  <h1>Swipe here</h1>
</div>

但是，使用运行iOS 13的iPad或iPhone都不会触发swipeleft或swiperight。

我是否缺少任何关键配置？还是该代码还有其他问题？

---

我还测试了此Stackblitz "blog-ng-swiping"，它在触摸设备上可以正常工作，但它使用的是Angular 8。

Answer 1

事实证明Angular 9有一个新的HammerModule，它用于与Hammer.JS相关的所有事情，并且还用于编译期间的树摇。

因此，除了Hammer.JS的整个配置，手势等。您还需要在您的应用程序中包含此模块，以使Hammer.JS与Angular 9一起使用。

HammerModule