Ngx-drag-scroll: Klickweitergabe

Erstellt am 13. Juli 2018  ·  8Kommentare  ·  Quelle: bfwg/ngx-drag-scroll

  • Ich schicke ein ...

    • [x] Fehlerbericht

    • [ ] Featureanfrage

    • [ ] Supportanfrage => Bitte reichen Sie hier keine Supportanfrage ein, siehe Hinweis oben in dieser Vorlage.

Ich habe einige Probleme, wenn ich den Klick ziehe und loslasse. Das Ereignis scheint seine Ausbreitung nicht zu stoppen, wie in "Problem Nr. 54 - Fehlerbehebung: Klickweitergabe unmittelbar nach dem Ziehen und Ablegen verhindern" angegeben ist.

  • Version: 1.8.2
  • Browser: alle Desktop-Browser

Alle 8 Kommentare

Ich kann 2.0.0-beta.3 nicht reproduzieren. Können Sie mir die Repro-Schritte geben?

Hallo! danke für die Antwort. Ich versuche, durch "divs"-Elemente zu scrollen, vielleicht ist das nicht der richtige Weg.
Hier ist der Code:

<drag-scroll class="drag-scroll center" #dragScroll scrollbar-hidden='true' drag-scroll-y-disabled='true' snap-disabled='true'>
        <div drag-scroll-item *ngFor="let ah of article_list">
          <col-article [article]="ah"></col-article >
        </div>
 </drag-scroll>

Ich klicke nur auf ein Bild, ziehe es, aber wenn ich es loslasse, werde ich nur zum Bildlink weitergeleitet. Gibt es eine andere Möglichkeit, ein "dragend"-Ereignis hinzuzufügen?

Gibt es einen Unterschied zwischen dem Scrollen auf einfachen Bildern und "divs"-Elementen? Der Rest des Moduls funktioniert einwandfrei und es ist eine wirklich gute Arbeit.

Ich habe versucht, das Problem in einer Demo zu reproduzieren, und es passiert, wenn das gezogene Element ein Link ist. In der Demo zum Beispiel, wenn du irgendein Bild aus änderst

<img _ngcontent-c6="" src="assets/img/c3po.png">

zu

<a href="http://anyurl.com"><img _ngcontent-c6="" src="assets/img/c3po.png"></a>

es hat das gleiche Verhalten wie in meinem Projekt.

Ich hoffe es hilft, Grüße!

Ich habe eine geringfügige Behandlung in meinem Code implementiert, um dieses Problem zu vermeiden.
html:
`

               <div   dragScroll   (reachesLeftBound)="leftBoundStat($event)" (reachesRightBound)="rightBoundStat($event)" #nav > 

                    <div class=" slide-mes"   *ngFor="let item of items " (click)="doAny(item)" >

                    </div>

                </div>

`

Typoskript:

`

@ViewChild('nav', {read: DragScrollDirective}) ds: DragScrollDirective;
clickEnable = true;
constructor( ) {
}
@HostListener('mousedown', ['$event'])
onMousedown(event) {

    this.clickEnable = true

}
leftBoundStat(reachesLeftBound: boolean) {
    this.leftNavDisabled = reachesLeftBound;
    this.clickEnable = false;
}

rightBoundStat(reachesRightBound: boolean) {
    this.rightNavDisabled = reachesRightBound;
    this.clickEnable = false;
}
doAny(item){
    if(this.clickEnable){
        //do what you whant on click here
    }
}

`

Hallo Guilherme! Danke für deine Antwort! Funktioniert das, wenn Sie keine der Grenzen erreichen? Da ich bei meiner Implementierung viele Elemente zum Scrollen habe und es sich trotzdem ausbreitet, wenn ich den Klick beispielsweise in der Mitte loslasse und nicht speziell in den Grenzen, und die Begrenzungsereignisse nur erzeugt werden, wenn Sie eines davon erreichen (links oder richtig).

Bounds-Ereignisse werden erzeugt, wenn Sie das div scrollen, fügen Sie eine console.log ein, um dies zu sehen.

Danke schön! Es funktionierte! Aber ich musste alle untergeordneten Komponenten anpassen, um auch auf die Mausereignisse zu hören. Deshalb habe ich nach dieser Funktion im Modul selbst gefragt.

Hallo @leogilardi6 , sorry für die späte Antwort. Ich wurde von der Arbeit überschwemmt.

Ich habe es versucht, indem ich https://github.com/bfwg/ngx-drag-scroll/blob/develop/demo/app/home/home.component.html#L4 -L12 geändert habe

    <drag-scroll class="demo-one"
      drag-scroll-y-disabled="true"
      scrollbar-hidden="true"
      (reachesLeftBound)="leftBoundStat($event)"
      (reachesRightBound)="rightBoundStat($event)"
      #nav
      >
      <a drag-scroll-item *ngFor="let image of imagelist" href="https://www.google.com"><img [src]="'assets/img/' + image" (click)="clickItem(image)"/></a>
    </drag-scroll>

aber ich war nicht in der Lage, in Version 2.0.0-beta.3 zu reproduzieren

hast du mal versucht mit der neusten version zu spielen?

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

bfwg picture bfwg  ·  13Kommentare

bfwg picture bfwg  ·  8Kommentare

BovineEnthusiast picture BovineEnthusiast  ·  5Kommentare

IlCallo picture IlCallo  ·  12Kommentare

suresh2018 picture suresh2018  ·  22Kommentare