it-swarm.com.de

Angular Änderungen der untergeordneten Gültigkeitsbereichsvariablen werden von JS an den übergeordneten Gültigkeitsbereich weitergegeben

Wie kann ich variable Änderungen vornehmen und sie einfach an ParentCtrl zurückgeben, obwohl in ChildCtrl eine 'neue' Variable instanziiert wird? Zusätzliche Punkte für minimale bis keine $ ons und $ watchs (erleichtert die Implementierung)

ParentCtrl

  • ChildCtrl/ChildCtrl2/ChildCtrl3/ChildCtrl4

    • Aussicht

Meine ChildCtrl-Funktionen unterscheiden sich nur geringfügig voneinander, da ich ein Master-Layout und eine ng-Ansicht nicht einfach abstrahieren kann, sie hängen jedoch alle von denselben Funktionen in ParentCtrl ab.

$ scope.searchTerms ist in ParentCtrl definiert, aber das Eingabefeld mit ng-model = 'searchTerms' befindet sich in der Ansicht der untergeordneten Controller. Wenn sich diese Variable ändert, werden in ParentCtrl nicht nur die ChildCtrls angezeigt.

Beispiel: http://jsfiddle.net/JHwxP/22/

HTML Teilweise

<div ng-app>
    <div ng-controller="Parent">
        parentX = {{x}} <br/>
        parentY = {{y}}<br/>
        <div ng-controller="Child">
            childX = {{x}}<br/>
            childY = {{y}}<br/>
            <a ng-click="modifyBothScopes()">modifyBothScopes</a><br>
            <br>
            The changes here need to appear in 'Parent'. <input ng-model='y'>
        </div>
    </div>
</div>

Controller

function Parent($scope) {
    $scope.x= 5;
    $scope.y= 5;
}

function Child($scope) {
    $scope.modifyBothScopes= function() {
       $scope.$parent.x++;
    };  
}

AKTUALISIEREN

Ich versuche derzeit einen Shared Service-Ansatz: https://Gist.github.com/exclsr/3595424

AKTUALISIEREN

Versuch eines Sende-/Rundfunksystems

Gelöstes Problem: Ich habe $ scope.searchTerms im übergeordneten Bereich gespeichert und beim Ändern ein Leerzeichen im untergeordneten Bereich erstellt.

Lösung: Ich hätte $ scope.search.terms im übergeordneten Element ausführen sollen, und wenn es im untergeordneten Element geändert würde, würde es zum übergeordneten Element aufsprudeln.

Beispiel: http://jsfiddle.net/JHwxP/23/

47

Dies liegt daran, wie die prototypische Vererbung funktioniert.

Wenn Sie im untergeordneten Controller nach $scope.x Fragen, wird überprüft, ob x in seinem Bereich definiert ist. Wenn nicht, wird im übergeordneten Bereich nach x gesucht.

Wenn Sie der Eigenschaft x des untergeordneten Bereichs zuweisen, wird nur der untergeordnete Bereich geändert.

Eine einfache Möglichkeit, damit umzugehen und das Freigabeverhalten zu ermitteln, besteht darin, ein Objekt oder ein Array zu verwenden.

function ParentCtrl($scope) {
  $scope.model = {x: 5, y: 5};
}

function ChildCtrl($scope) {
  $scope.update = function(x, y) {
    $scope.model.x = x;
    $scope.model.y = y;
  };
}

Hier sind die Änderungen in beiden Bereichen sichtbar, da $scope.model In übergeordneten und untergeordneten Bereichen auf dasselbe Objekt verweist.

John Lindquist hat ein Video daz .

87
satchmorun

Eine andere Lösung, bei der nicht mehrere Objekte erstellt werden, die als Referenz übergeben werden sollen, besteht darin, Setter-Funktionen im übergeordneten Controller zu erstellen.

function ParentCtrl($scope) {
  $scope.x = 5;
  $scope.y = 5;

  $scope.setX = function(value) {
    $scope.x = value;
  }

  $scope.setY = function(value) {
    $scope.y = value;
  }
}

function ChildCtrl($scope) {
  $scope.update = function(x, y) {
    $scope.setX(x);
    $scope.setY(y);
  };
}

Ich halte dies für sauberer, wenn es möglicherweise nicht sinnvoll ist, dass die Daten Teil desselben Objekts sind.

Sie könnten auch verrückt werden und so etwas im Kind tun:

function ChildCtrl($scope) {
  var superSetX = $scope.setX;
  $scope.setX = function(value) {
    superSetX(value * 2);
  };
  ...
}
14
rtcherry

Ich habe so etwas gesucht. Die erste Lösung kam nach dem Lesen von this . Sie können ein übergeordnetes Modell für einen untergeordneten Controller freigeben.

Hier ist ein Beispiel . Ich benutze sogar eine Reihe von Gegenständen, um meinen Standpunkt zu beweisen. Der ChildController ändert seine Eltern , als wären sie alle Teil der gleiches Universum.

0
genuinefafa