typescript - Angular/HammerJS - หลีกเลี่ยงท่าทางหมุนขณะทำการห่าง/เข้าของการหนีบ

ฉันกำลังพยายามเปิดใช้งานท่าทางการหยิกโดยไม่เปิดท่าทางการหมุนด้วย จุดประสงค์ของฉันคือการเปิดทั้งสองท่าทางแยกกัน

ฉันได้สร้างการกำหนดค่า Hammer ในโมดูลของฉันดังนี้:

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

export class HammerConfig extends HammerGestureConfig{

    buildHammer(element: HTMLElement)
    {
        const hammerManager = new Hammer(element);
        let rotate = new Hammer.Rotate({enable: true});
        let pinch = new Hammer.Pinch({enable: true});
        let pan = new Hammer.Pan();

        pan.requireFailure([rotate, pinch]);
        pinch.recognizeWith(rotate);
        hammerManager.add([rotate, pan, pinch]);

        return hammerManager;
    }
}

ฉันกำลังพยายามกับ:

pinch.dropRecognizeWith(rotate);

และ

rotate.dropRecognizeWith(pinch);

การเปลี่ยนแปลงนี้ใช้ไม่ได้ มีเพียงท่าทางการหมุนเท่านั้นที่ถูกเปิดใช้งาน...

ถ้าฉันเพิ่ม:

pinch.recognizeWith(rotate);

มันเปิดตัวทั้งสองเหตุการณ์...

มีวิธีใดบ้างที่จะเปิดพวกเขาแยกกันได้ไหม? ฉันจะขอบคุณความช่วยเหลือทุกประเภท

คำตอบ #1

ฉันมองเข้าไปในโปรเจกต์ของฉันที่ฉันใช้ HammerJS ในแอป Angular 5, 6 และ 7 และฉันใช้วิธีต่าง ๆ ในการกำหนดค่า HammerJS.

ไอเดียของคุณในการปิดการหมุน/การหยิก/การเลื่อนในสถานการณ์เฉพาะนั้นถูกต้องและตามเอกสารก็ถือว่าโอเค

นี่คือตัวอย่างการตั้งค่าของฉันโดยไม่มี requireFailure และ recognizeWith:

export class MyHammerConfig extends HammerGestureConfig {
    overrides = <any>{
        'swipe': {direction: Hammer.DIRECTION_ALL}, // override default settings
        'pan': {direction: Hammer.DIRECTION_ALL}
    };
}

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

ในลักษณะนี้ การตั้งค่าของคุณควรมีลักษณะดังนี้:

export class MyHammerConfig extends HammerGestureConfig {
    overrides = <any>{
        'rotate': {
            direction: Hammer.DIRECTION_ALL,
            enable: true
        }, // override default settings
        'pinch': {
            direction: Hammer.DIRECTION_ALL,
            enable: true,
            recognizeWidth: 'rotate'
        },
        'pan': {
            direction: Hammer.DIRECTION_ALL,
            requireFailure: ['rotate, pinch']
        }
    };
}

ถ้านี่ใช้ไม่ได้สำหรับคุณ บอกฉันได้เลย ฉันจะพยายามแก้ปัญหาของคุณพรุ่งนี้เพราะวันนี้ฉันไม่มีเวลามากกว่านี้

ดูเอกสาร Angular เกี่ยวกับการเขียนทับตามเอกสาร HammerJS ที่นี่ด้วย