【问题标题】:(swipeup) isn't triggering in Angular 4 with Hammerjs(swipeup) 没有在带有 Hammerjs 的 Angular 4 中触发
【发布时间】:2017-09-14 13:11:09
【问题描述】:

我注意到指令 (swipeup) 似乎不起作用: 我试过使用 (swipeleft) 并且有效:

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

有没有人对此有解决方案/解决方法。我已经查看但没有找到与我的问题相关的解决方案。

谢谢你, J.

【问题讨论】:

  • 如何导入锤子? (滑动)有效吗?
  • 当我使用(滑动)时,它会在我左右滑动而不是上下滑动时触发

标签: html angular hammer.js


【解决方案1】:

您可以从 @angular/platform-b​​rowser 导入锤子配置并覆盖它。默认情况下,上下滑动是关闭的,因为它们可能会在用户尝试滚动时导致问题。

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 { }

【讨论】:

  • 非常感谢!
【解决方案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 }); 

【讨论】:

  • 我会在哪里实现这个?
  • 你在哪里导入hammerJS?你的代码中有脚本标签吗?
  • 感谢您的输入,下面的答案是我的问题的解决方案。
猜你喜欢
  • 2020-10-27
  • 1970-01-01
  • 2016-07-17
  • 1970-01-01
  • 2017-09-17
  • 2019-11-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多