在Angular 4中使用Hammerjs时，“swipeup”事件无法触发。

Question

我注意到指令（swipeup）似乎无法正常工作： 我尝试使用（swipeleft），它是有效的：

<div [@myAnimation] (swipeup)="showActionBar = false" fxFlex="56px" *ngIf="showActionBar" fxLayoutWrap fxLayoutAlign="start center"fxLayoutGap="8px" class="overview-actions">

有没有人能提供针对此问题的解决方案或变通方法？我看过一些资料但没有找到与我的问题相关的解决方案。

谢谢， J.

- Jan Somers JanS91

---

你如何导入 Hammer？(swipe) 有效吗？ - Vega

当我使用（滑动）时，它会在我向左和向右滑动时触发，但不会在向上和向下滑动时触发。 - Jan Somers JanS91

Answer 1

您可以从@angular/platform-browser导入hammer配置并覆盖它。向上和向下滑动默认情况下关闭，因为它们可能会干扰用户滚动。

app.module.ts

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

  export class HammerConfig extends HammerGestureConfig {
    overrides = <any>{
      'swipe': { direction: Hammer.DIRECTION_ALL }
    };
  }

  @NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule
    ],
    providers: [
      {
        provide: HAMMER_GESTURE_CONFIG,
        useClass: HammerConfig
      }
    ],
    bootstrap: [AppComponent]
  })
  export class AppModule { }

- JayChase

---

我不得不添加覆盖装饰器 override overrides = <any>{ ...。 - Ade

Answer 2

根据this，你可以试试这个吗？

var hammertime = new Hammer(document.body);

hammertime.get('swipe').set({ direction: Hammer.DIRECTION_ALL });

根据文档，"默认情况下，它会添加一组轻拍、双击、按压、水平滑动和滑动识别器，以及多点触控的捏合和旋转识别器。由于捏合和旋转识别器会使元素阻塞，因此默认情况下它们是禁用的，但您可以通过调用以下方法来启用它们："

hammertime.get('pinch').set({ enable: true });
hammertime.get('rotate').set({ enable: true });

启用垂直或所有方向的平移和滑动识别器：

hammertime.get('pan').set({ direction: Hammer.DIRECTION_ALL });
hammertime.get('swipe').set({ direction: Hammer.DIRECTION_VERTICAL }); 

- Brr Switch

---

我应该在哪里实现这个？ - Jan Somers JanS91

你在哪里导入 HammerJS？你的代码中有 script 标签吗？ - Brr Switch

感谢您的输入，下面的答案是解决我的问题的方案。 - Jan Somers JanS91