Angular JS Resizable Div Direktive

Meine Site wird mehrere Abschnitte enthalten, von denen jeder in der Größe veränderbar sein soll. Um dies zu erreichen, habe ich eine "resizable" -Richtlinie erstellt, z.

<div class="workspace" resize="full" ng-style="resizeStyle()">
<div class="leftcol" resize="left" ng-style="resizeStyle()">

Mit einer Anweisung, die ungefähr so ​​aussieht:

lwpApp.directive('resize', function ($window) {
    return {
        scope: {},

        link: function (scope, element, attrs) {
            scope.getWinDim = function () {
                return {
                    'height': window.height(),
                    'width': window.width()
                };
            };

            // Get window dimensions when they change and return new element dimensions
            // based on attribute
            scope.$watch(scope.getWinDim, function (newValue, oldValue) {
                scope.resizeStyle = function () {
                    switch (attrs.resize) {
                    case 'full':
                        return {
                            'height': newValue.height,
                            'width': (newValue.width - dashboardwidth)
                        };

                    case 'left':
                        return {
                            'height': newValue.height,
                            'width': (newValue.width - dashboardwidth - rightcolwidth)
                        };

                    etc...
                };
            }, true);

            //apply size change on window resize
            window.bind('resize', function () {
                scope.$apply(scope.resizeStyle);
            });
        }
    };
});

Wie Sie sehen können, ändert dies nur die Größe jedes div im Fenster und jede Direktive hat einen isolierten Bereich. Dies funktioniert einwandfrei für das, wofür es erstellt wurde, aber letztendlich möchte ich eine Teilmenge der Divs über eine ziehbare Leiste skalieren. Zum Beispiel

div1     div2
----------------
|     ||       |
|     ||       |
|     ||       |
|     ||       |
----------------
    draggable bar in middle

Bei der Bewegung der ziehbaren Leiste (in horizontaler Richtung) müsste ich vermutlich über den Bereich eines übergeordneten Controllers (?) Auf beide div1- und div2-Breiten zugreifen. Meine Fragen sind:

Ist dies der "richtige" Weg, um veränderbare Divs im Winkel herzustellen? Insbesondere, wenn die Größe eines Divs einen anderen beeinflusst?

Ich persönlich habe das Gefühl, dass die Antwort auf (1) lautet: "Nein, ich mache es nicht richtig, weil ich nicht zwischen Richtlinien kommunizieren kann, wenn jede einen isolierten Geltungsbereich hat." Wenn dies zutrifft, wie kann ich sowohl die Fenstergröße als auch die ziehbare Größenänderung zwischen Divs berücksichtigen?

Antworten auf die Frage(4)

Ihre Antwort auf die Frage