Ngx-drag-scroll: перетаскивание прокрутки не работает в мобильном представлении

Относится к # 20

PR установлен, я просто собираюсь еще раз просмотреть код и выпустить новую версию. Не стесняйтесь добавлять любые комментарии, если считаете, что в PR-коде что-то не так. @ suresh2018 @nachocoig.

1.3.7 отсутствует. Сообщите мне, если это не решит проблему для вас, еще раз спасибо за вашего пациента.

@bfwg

1.3.6 показала ошибку отмены щелчка, но 1.3.7 не показывала эту ошибку.
эта версия также перетаскивает прокрутку, не работающую в мобильном телефоне.

заранее спасибо

не работает 1.3.7

@ suresh2018 У меня работает. У вас работает перетаскивание прокрутки на рабочем столе?

рабочий стол работает нормально. но не мобли (iphone 6 plus)

Странно, можешь показать мне кусок кода карусели? Вы пробовали на реальном устройстве?

* горизонтальная прокрутка *

div class = "hideoverflow" прокрутка с перетаскиванием

            img *ngFor="let img of pic.images; let idx = index" [src]="img .Image" 
              class="scroll-images"

          div

Пробовали ли вы демонстрацию перетаскивания (в README.md) на сенсорных устройствах?

@rahil

демонстрация перетаскивания прокрутки не работает сенсорное устройство

@ suresh2018 @bfwg Я использую эту

1. Экран, на котором используется перетаскивание, отключает все события щелчка на этом экране.
   Например

<ion-content>
  <ion-grid>
    <ion-row>
      <ion-col>
        <button ion-button (click)="foo()">Click Me!</button>
        <!-- On mobile view click stops working. If I remove [drag-scroll] it starts working again -->
      </ion-col>
      <ion-col>
        <div drag-scroll>
          <!-- *ngFor let item of items (horizontal scroll) -->
          <button ion-button (click)="someFunc()"></button>
          <!-- also click event don't work in mobile view. Fixes if [drag-scroll] is removed! -->
        </div>
      </ion-col>
      <ion-col>
        <button ion-button (click)="bar()">Click Me Again!</button>
        <!-- On mobile view click stops working. If I remove [drag-scroll] it starts working again -->
      </ion-col>
    </ion-row>
  </ion-grid>
</ion-content>

1. [scrollbar-hidden] = "true" удаляет весь компонент перетаскивания-прокрутки с экрана (Ionic 2). «ложь» - нет.

Привет, @ rahil051

1. Событие click не срабатывает, исправлено в v1.3.7.
2. вам нужно написать scrollbar-hidden="true" или просто scrollbar-hidden для фиксированного атрибута. Если вы хотите привязать атрибут к переменной в вашем компоненте, вам нужно написать [scrollbar-hidden]="flagVariable" примечание, когда использовать квадратные скобки.

Для получения дополнительной информации посетите https://github.com/bfwg/angular2-drag-scroll/blob/master/demo/app/home/home.component.html#L26.

@ suresh2018 Мне не удалось воспроизвести проблему с сенсорным npm install && npm start для запуска демонстрационного приложения на порту :4200 ? Вы можете использовать инструмент разработчика Chrome, чтобы проверить, работает ли он для вас.

Привет @bfwg , извините за мой поздний ответ (я был в минивактерии; D)

Я переустановил вашу демонстрацию компонентов angular, и да, она работает в мобильной версии!
Я также пробовал использовать его в своем приложении, и он тоже работает!

Спасибо за внимание!

Хорошая работа!

Привет @bfwg!

наконец, я нашел эту проблему.
нужно установить горизонтальную ширину, тогда только она будет работать

Благодарность ..

Привет @bfwg!
наконец, я нашел эту проблему.
нужно установить горизонтальную ширину, тогда только она будет работать
Благодарность

Милый, рад, что это сработало для вас, ребята. Я могу спокойно закрыть эту проблему сейчас.

Спасибо, что снова сообщили об этой проблеме!

Эй, это, безусловно, лучшая библиотека каруселей ng2! Однако я не могу заставить его работать на мобильных устройствах.

• Демо-приложение отлично работает на настольных компьютерах и мобильных устройствах.
• Мой код работает только на рабочем столе. Перетаскивание не работает на мобильных устройствах

нужно установить горизонтальную ширину, тогда только она будет работать

Я установил ширину: 100% для прокрутки с перетаскиванием, для оболочки за пределами прокрутки с перетаскиванием и для div внутри прокрутки с перетаскиванием (все возможные комбинации), и он все еще не работает.

РЕДАКТИРОВАТЬ:
Я клонировал репозиторий, развернул и протестировал его на мобильных устройствах, и он отлично работает. У меня те же HTML и CSS, что и в home.component, но перетаскивание работает только на рабочем столе. Я полагаю, мне не нужны угловые материалы в моем проекте.

Привет @kzntswsk , спасибо за отзыв. Можете ли вы сделать небольшую демонстрацию с https://plnkr.co/? Я не могу помочь тебе, не разыгрывая твой код 😄

Привет @kzntswsk , спасибо за отзыв. Можете ли вы сделать небольшую демонстрацию с https://plnkr.co/? Я не могу помочь тебе, не разыгрывая твой код 😄

Я тоже с этим сталкивался. Я не могу сделать plnkr прямо сейчас, но, похоже, он делает это только с scrollbar-hidden="true" тогда как просто scrollbar-hidden ничего не делает.

РЕДАКТИРОВАТЬ: если я перейду к .drag-scroll-content в инструменты разработчика и сниму overflow: hidden auto; он исправит это, но полоса прокрутки снова будет видна. Так что, похоже, это связано с методом, используемым для скрытия полосы прокрутки на мобильных устройствах.

Проблема в том, что события не запускаются в Chrome Dev Tools в режиме устройства.