Ngx-drag-scroll: Drag Scroll funktioniert in der mobilen Ansicht nicht

Erstellt am 22. Aug. 2017  ·  22Kommentare  ·  Quelle: bfwg/ngx-drag-scroll

bug

Hilfreichster Kommentar

@suresh2018 Ich konnte das Touch-Problem auf dem iPhone 6 Plus nicht reproduzieren. Ich teste die Demo-App. Können Sie dieses Repository klonen und npm install && npm start ausführen, um die Demo-App auf Port :4200 starten? Sie können das Chrome-Entwicklertool verwenden, um zu überprüfen, ob es für Sie funktioniert.

Alle 22 Kommentare

Bezieht sich auf #20

Die PR ist fertig, ich werde den Code nur noch einmal überprüfen und eine neue Version veröffentlichen. Fühlen Sie sich frei, Kommentare einzugeben, wenn Sie der Meinung sind, dass etwas mit dem PR-Code nicht stimmt. @suresh2018 @nachocoig.

1.3.7 ist raus. Lassen Sie es mich wissen, wenn das Problem für Sie nicht behoben ist, nochmals vielen Dank für Ihren Patienten.

@bfwg

1.3.6 zeigte einen Klick-Abbruch-Fehler, aber 1.3.7 zeigte diesen Fehler nicht an.
Diese Version funktioniert auch nicht mit Drag-Scroll auf dem Handy.

vielen Dank im Voraus

image

funktioniert nicht 1.3.7

@suresh2018 Bei mir funktioniert es. Funktioniert Drag Scroll für Sie in der Desktop-Ansicht?

Desktop funktioniert gut, aber nicht moblie (iphone 6 plus)

Seltsam, kannst du mir einen Teil deines Karussellcodes zeigen? Hast du es auf einem echten Gerät probiert?

* horizontales Scrollen *

div class="hideoverflow" Drag-Scroll

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

          div

Haben Sie die Drag-Scroll-Demo (in README.md) auf Touch-Geräten ausprobiert?

@rahil

Demo Drag Scroll funktioniert nicht Touch-Gerät

@suresh2018 @bfwg Ich verwende diese

  1. Der Bildschirm, auf dem Drag-Scroll verwendet wird, deaktiviert alle Klickereignisse auf diesem Bildschirm
    Zum Beispiel
<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" entfernt die gesamte Drag-Scroll-Komponente vom Bildschirm (Ionic 2). "falsch" nicht.

Hallo, @rahil051

  1. Klick-Ereignis, das nicht ausgelöst wird, wurde in v1.3.7 behoben.
  2. Sie müssen entweder scrollbar-hidden="true" oder einfach scrollbar-hidden für ein festes Attribut schreiben. Wenn Sie das Attribut an eine Variable in Ihrer Komponente binden möchten, müssen Sie [scrollbar-hidden]="flagVariable" notieren, wann die eckigen Klammern verwendet werden sollen.

Weitere Informationen finden Sie unter https://github.com/bfwg/angular2-drag-scroll/blob/master/demo/app/home/home.component.html#L26

@suresh2018 Ich konnte das Touch-Problem auf dem iPhone 6 Plus nicht reproduzieren. Ich teste die Demo-App. Können Sie dieses Repository klonen und npm install && npm start ausführen, um die Demo-App auf Port :4200 starten? Sie können das Chrome-Entwicklertool verwenden, um zu überprüfen, ob es für Sie funktioniert.

Hallo @bfwg , sorry für meine späte Antwort (ich war im Kurzurlaub ;D)

Ich habe Ihre Winkelkomponenten-Demo neu installiert und ja, es funktioniert in der mobilen Version!
Ich habe auch versucht, es in meiner App zu verwenden, und es funktioniert auch!

Danke für deine Aufmerksamkeit!

Gute Arbeit!

Hallo @bfwg ,

Endlich finde ich dieses Problem.
müssen Sie die horizontale Breite einstellen, dann funktioniert es nur

Danke ..

Hallo @bfwg ,
Endlich finde ich dieses Problem.
müssen Sie die horizontale Breite einstellen, dann funktioniert es nur
Danke

Süße, schön, dass es bei euch funktioniert hat. Ich kann dieses Problem jetzt bedenkenlos schließen.

Vielen Dank, dass Sie dieses Problem erneut gemeldet haben!

Hey, das ist mit Abstand die beste ng2-Karussellbibliothek! Auf dem Handy kann ich es aber nicht zum Laufen bringen.

  • Demo-App funktioniert gut auf Desktop und Handy
  • Mein Code funktioniert nur auf dem Desktop. Ziehen funktioniert nicht auf dem Handy

müssen Sie die horizontale Breite einstellen, dann funktioniert es nur

Ich habe width:100% auf Drag-Scroll, auf einem Wrapper außerhalb von Drag-Scroll und auf einem div innerhalb von Drag-Scroll (alle möglichen Kombinationen) eingestellt und es funktioniert immer noch nicht.

BEARBEITEN:
Ich habe das Repository geklont, bereitgestellt und auf Mobilgeräten getestet und es funktioniert einwandfrei. Ich habe das gleiche HTML und CSS wie in home.component, aber das Ziehen funktioniert nur auf dem Desktop. Ich gehe davon aus, dass ich in meinem Projekt keine eckigen Materialien benötige.

Hey @kzntswsk , danke für das Feedback. Kannst du mit https://plnkr.co/? eine kleine Demo machen

Hey @kzntswsk , danke für das Feedback. Kannst du mit https://plnkr.co/? eine kleine Demo machen

Ich bin auch darauf gestoßen. Ich kann gerade keinen plnkr machen, aber es scheint dies nur mit scrollbar-hidden="true" zu tun, während nur scrollbar-hidden nichts tut.

BEARBEITEN: Wenn ich in den Entwicklungstools zu .drag-scroll-content gehe und overflow: hidden auto; abwähle, wird es behoben, aber die Bildlaufleiste ist wieder sichtbar. Dies scheint also mit der Methode zu tun zu haben, mit der die Bildlaufleiste für Mobilgeräte ausgeblendet wird.

Das Problem ist, dass Ereignisse in Chrome Dev Tools im Gerätemodus nicht ausgelöst werden

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

Andi1990 picture Andi1990  ·  10Kommentare

bfwg picture bfwg  ·  8Kommentare

Another-Sam picture Another-Sam  ·  12Kommentare

IlCallo picture IlCallo  ·  14Kommentare

bfwg picture bfwg  ·  13Kommentare