No puedo reconocer los deslizamientos en mi aplicación Angular usando Hammer.JS. Está configurado así:
"@angular/core": "~9.0.0-next.6", "hammerjs": "^2.0.8", "zone.js": "~0.10.2"app.module.ts se ve así:
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 tiene este método:
onSwipe() { console.log('swipe'); }Y finalmente app.component.html se ve así:
<div (swipeleft)="onSwipe()" (swiperight)="onSwipe()"> <h1>Swipe here</h1> </div> Sin embargo, ni swipeleft hacia la izquierda ni el deslizamiento hacia la swiperight se activan nunca con un iPad o un iPhone con iOS 13.
¿Me estoy perdiendo alguna configuración crucial? ¿O tengo otro problema con este código?
También probé este "blog-ng-swiping" de Stackblitz que funciona bien en los dispositivos táctiles, pero usa Angular 8.
Resulta que Angular 9 tiene un nuevo HammerModule que se usa para todo lo relacionado con Hammer.JS y también para sacudir árboles durante la compilación.
Entonces, además de toda la configuración de Hammer.JS, gestos, etc., también debe incluir este Módulo en su aplicación para que Hammer.JS funcione con Angular 9:
import { HammerModule } from '@angular/platform-browser'; @NgModule({ imports: [ HammerModule ] )}