iOS horizontal scroll issue while using press event on the child element

[PrItHvI7]

i am developing a application using angular framework. I have used a hammerjs package for press event on the child elements, were there are number of child elements that creates an horizontal scroll. However after i applied this press event on the child elements, it restricts scroll while touching on the child element, where press event is applied, on iOS safari. The same issue i had solved on android chrome browser by using [style.touch-action]="'pan-x'" . however i am not finding solution for iOS safari. i hope someone knows the solution here.

this is the tag where press event is applied:

  <li [ngClass]="{'active':selectedCustomerIndex == i}" *ngFor="let item of customers;let i=index;" (press)="onLongPress(item)" [style.touch-action]="'pan-x' (click)="updateUserBasedProducts(item,i,$event);"> 
    </li>

[elron]

Same as https://github.com/hammerjs/hammer.js/issues/1183

and mentioned here as well: https://stackoverflow.com/questions/51815182/hammerjs-in-safari-scroll-issue

[elron]

I found a solution

1. Add this to app.module.ts

   export class BaluHammerConfig extends HammerGestureConfig {
   overrides = {
     pan: {
         direction: 6
     },
     pinch: {
         enable: false
     },
     rotate: {
         enable: false
     }
   };
   }

2. instead of adding HammerGestureConfig to your providers, use this:

   {
     provide: HAMMER_GESTURE_CONFIG,
     useClass: BaluHammerConfig
   },