Verwenden von ng2-dragula zum Ziehen und Vertauschen von Rasterlisten

8

Ich habe ein Raster von Listen und versuche, die Kacheln des Rasters mit Hilfe von ng2-tagula

zu ziehen und zu vertauschen

some.component.html

%Vor%

some.component.ts

%Vor%

Meine Idee war, Daten über das Drop-Ereignis auszutauschen. Gibt es ein OnDrop-Event, das dem HTML so hinzugefügt werden kann?

(onDrop) = "swap(data)" und dann die swap(data:any) in der Komponentenklasse?

oder muss ich den Dragulaservice initialisieren? Gibt es einen besseren Weg, um stattdessen zu tauschen?

Ich bin absolut neu in eckigen und ich finde das lächerlich schwer zu folgen. Jeder Tipp würde sehr geschätzt werden?

    
Mellkor 15.02.2017, 15:15
quelle

1 Antwort

1

Wenn Sie einfach mit ng2-dragula von einer Liste zu einer anderen ziehen, müssen Sie nicht auf ein Ereignis reagieren, die Anweisungen behandeln das für Sie. Der Wechsel von einer Liste zu einer anderen scheint nicht unterstützt zu werden, aber ich habe ein einfaches sytype zur Verfügung gestellt und hoffentlich wird es dir dabei helfen, dich auf den Weg zu bringen.

Stelle zuerst sicher, dass es in deinem app.module.ts korrekt enthalten ist

%Vor%

In Ihrer Komponente müssen Sie Ihre Listen erstellen. Sie müssen möglicherweise auch die CSS-Datei von node_modules/dragula/dist/dragula.css einfügen.

Ich habe dem Ereignis drop eine Bindung hinzugefügt, als das, worüber du neugierig warst. Dieses Szenario druckt einfach die neuen Listen auf die Konsole und demonstriert die Zwei-Wege-Bindung.

%Vor%

In Ihrer Vorlage müssen Sie die Direktiven dragula und dragulaModel hinzufügen, die die bidirektionale Datenbindung ermöglichen. Beachten Sie, dass beide Listen die gleiche "Tasche" haben.

%Vor%     
Christopher Moore 21.02.2017 12:29
quelle