eckige, verschachtelte Wiederholung breaking Direction (packery + dragabilly)

Question

Ich habe ein kleines Problem mit Dragabilly in eckig, das Problem ist seltsam, weil es funktionierte, bis ich einige Änderungen an, wie der Inhalt mit patiery geladen wurde, speziell gemacht Hinzufügen einer Ebene verschachtelter Wiederholungen Wenn ich dies tue, läuft die Packung immer noch korrekt, aber es scheint, dass Dragabilly nur auf dem ersten Objekt ausgeführt wird.

Die html sieht aus wie -

<div class="item gs-w" ng-class="widget.size" ng-repeat="widget in contentHere" packery-angular > 
    <!-- nested repeat --> 
    <div ng-repeat="side in widget.sides" ng-show="side.active"> 

So ist es nur eine verschachtelte Wiederholung wo Packery aus den äußeren Elementen laufen, und wieder, das Packery Element funktioniert. Es brach, als ich in der verschachtelten Wiederholung hinzugefügt - diese Objekte haben mehrere Gesichter, die ich mit dieser Seite verstecken.acive Sie sehen, aber das Zieh-Handle ist innerhalb der verschachtelten Wiederholung und ich denke, dass dies das Problem sein kann, oder vielleicht die verschachtelten ist etwas länger zum Laden und es erkennt den Griff nicht rechtzeitig? Ich bin mir nicht sicher, und da könnte ich eine Richtung einschlagen.

Hier ist die Richtlinie - http://jsfiddle.net/yq4zwLzs/. Das Einzige, was ich hinzugefügt habe, war der mobile UA-Check, um zu versuchen, Dragabilly auf mobilen Geräten abzuschalten, weil es zu diesem Zeitpunkt unnötig ist. Ich habe versucht, das wegzunehmen, es scheint nichts zu bewirken. Hier

ist ein Plunker davon in Aktion -

http://plnkr.co/edit/HSVztH3vlf5VI1lf1tFR?p=preview

die Hässlichkeit Vergib - aber wenn Sie schauen, können Sie rund um das obere Element verschieben, aber nicht das untere Element. Dort stecke ich fest und ich kann nicht herausfinden, wie oder warum das passiert. Sie können die Elemente mit dem .handle (Titelelement) ziehen. Ich würde jede Hilfe schätzen, da ich hier festsitze.

Danke fürs Lesen!

aktualisiert

Es scheint sogar, wenn ich außerhalb der inneren Wiederholung der .handle setzte, ist es immer noch das gleiche Problem hat. Vielleicht hat es damit zu tun, dass die innere Wiederholung und die eckige Packung laufen?

Update 2

Es die Logik Ziehgriff angezeigt wird gar nicht funktioniert, Sie von etwas ziehen, nicht nur .handle

Update 3

ich fast sicher bin, Das hat etwas mit dem verschachtelten ng-repeat zu tun (vielleicht interagiert es in Verbindung mit der Ausführung der Direktive auf dem Objekt), denn egal was ich versuche, solange ich die verschachtelte Wiederholung habe, habe ich das gleiche Problem. Wenn ich es abreißen geht es zurück als normal zu arbeiten, aber es wird schwer sein, mein gewünschtes Ziel zu erreichen, ohne es :(

auch -. Wenn i

var draggable2 = new Draggabilly(element[0], {handle: '.handle'}); 

in

var draggable2 = new Draggabilly(element[0]); 

drehen

Es funktioniert gut, aber ich brauche einen Ziehgriff, da es Inhalt in diesen divs gibt, mit denen der Benutzer interagiert, und ich möchte nicht, dass sich das div bewegt, wenn er darin herumklickt.Vielleicht, wenn es eine Möglichkeit gibt, Dragabilly etwas später zu initiieren?

Answer 1

Sieht aus wie könnte es ein Digest Problem sein, als wenn Sie die Draggabilly Schöpfung in einem $ timeout halten es als

if(!isMobile()){ 
    $timeout(function(){ 
     var draggable2 = new Draggabilly(element[0], {handle: '.handle'}); 
     $rootScope.packery.bindDraggabillyEvents(draggable2); 
    }) 
} 

http://plnkr.co/edit/qxv1VWPHZEKX3pVHgBi2?p=preview

Eine Sache der Anmerkung während Hantieren bemerkte ich erwartet funktioniert Wenn Sie eine andere Option als handle verwenden, zum Beispiel { axis: 'x'}, dann funktioniert es ohne die Notwendigkeit für die $timeout.