Angularjs, passender Spielraum zwischen Wegen

Ich habe eine situation mit einer form, die sich über mehrere Seiten (vielleicht nicht ideal, aber das ist, wie es ist). Ich würde gerne einen Rahmen für das gesamte Formular, das wird ausgefüllt, wie Sie entlang gehen, so dass, wenn der Benutzer geht hin und her zwischen den Schritten ist es leicht, zu erinnern, den Zustand.

Also muss ich es tun, in der sehr-pseudo-code:

  1. Set $scope.val = <Some dynamic data>
  2. Auf einen link klicken und weitergeleitet werden, um eine neue Vorlage (wahrscheinlich mit dem gleichen controller).
  3. $scope.val sollte immer noch den gleichen Wert, wie es war auf der letzten Seite.

Ist irgendwie beibehalten von Daten, die für den Anwendungsbereich der richtige Weg zu gehen über diese, oder gibt es eine andere Möglichkeit? Können Sie selbst erstellen und einen controller, der hat einen permanenten Bereich zwischen den Routen, außer für die Speicherung in einer Datenbank natürlich.

Kommentar zu dem Problem
Nur als Ergänzung zu ganaraj: Hier finden Sie eine wirklich schöne blog-Eintrag mit einem screencast, wie man die verschiedenen Steuerungen zu kommunizieren. Es gibt auch ein paar hilfreiche jsfiddles zu spielen, um mit. onehungrymind.com/angularjs-communicating-between-controllers ich hoffe, es hilft. Kommentarautor: F Lekschas

InformationsquelleAutor der Frage Erik Honn | 2012-12-14

  1. 136

    Müssen Sie einen Dienst nutzen, da ein service beibehalten wird, während Ihrer app Leben.

    Können sagen, Sie wollen, um Daten zu speichern, die zu einem Benutzer

    Dies ist, wie definieren Sie den service : 

    app.factory("user",function(){
        return {};
});

    In Ihrem ersten controller: 

    app.controller( "RegistrationPage1Controller",function($scope,user){
    $scope.user = user;
    //and then set values on the object
    $scope.user.firstname = "John";
    $scope.user.secondname = "Smith";
});

app.controller( "RegistrationSecondPageController",function($scope,user){
        $scope.user = user;
        //and then set values on the object
        $scope.user.address = "1, Mars";

    });

    InformationsquelleAutor der Antwort ganaraj

  2. 9

    Dem Dienst zu arbeiten, aber eine logische Weg, es zu tun mit nur normalen scopes und Controllern ist, um Ihre Controller und Elemente, so dass es spiegelt die Struktur des Modells. Insbesondere benötigen Sie ein übergeordnetes element und-Steuerung, die Schaffung eines übergeordneten Bereich. Die einzelnen Seiten des Formulars Leben sollte, in eine Ansicht, die ein Kind zu den Eltern. Die übergeordneten Bereichs bleibt auch, wie die untergeordnete Ansicht wird aktualisiert.

    Ich nehme an, Sie sind mit ui-router, so können Sie verschachtelte benannte Ansichten. Dann in pseudo-code:

    <div ng-controller="WizardController">
  <div name="stepView" ui-view/>
</div>

    Dann WizardController definiert den scope-Variablen, die Sie beibehalten möchten, über die Schritte des multi-page-form (ich beziehe mich als "Assistenten"). Dann ist dein Strecken-update stepView nur. Jeder Schritt kann über eigene templates, Controller und scopes, aber Ihre Spielräume sind verloren, von Seite zu Seite. Aber die Bereiche, in WizardController erhalten sind, auf allen Seiten.

    Zur Aktualisierung der WizardController Bereiche von der Kindes-Controller, werden Sie brauchen, um verwenden Sie eine syntax wie $scope.$parent.myProp = 'value' oder eine Funktion definieren, die setMyProp auf WizardController für jeden Rahmen variabel. Andernfalls, wenn Sie versuchen, den übergeordneten scope-Variablen direkt aus der untergeordneten Steuerungen, du wirst am Ende nur die Schaffung eines neuen scope-variable, die auf das Kind selbst, die überschatteten den übergeordneten Variablen.

    Ziemlich schwer zu erklären und ich entschuldige mich für den Mangel an einem vollständigen Beispiel. Im Grunde wollen Sie einen übergeordneten controller, der legt einen übergeordneten Rahmen, der erhalten wird, die über alle Seiten des Formulars.

    InformationsquelleAutor der Antwort tksfz

  3. 5

    Können die Daten übergeben werden, die zwischen Controllern über zwei Wege

    1. $rootScope
    2. Modell

    Das Beispiel unten zeigt die übergabe der Werte mit dem Modell

    app.js

    angular.module('testApp')
  .controller('Controller', Controller)
  .controller('ControllerTwo', ControllerTwo)
  .factory('SharedService', SharedService);

    SharedService.js

    function SharedService($rootScope){

 return{
    objA: "value1",
    objB: "value2"
  }
}

    //Ändern Sie den Wert im controller Ein

    Controller.js

    function Controller($scope, SharedService){

 $scope.SharedService = SharedService;

 $scope.SharedService.objA = "value1 modified";
}

    //Zugriff auf den Wert in controllertwo

    ControllerTwo.js

    function ControllerTwo($scope, SharedService){

 $scope.SharedService = SharedService;

 console.log("$scope.SharedService.objA"+$scope.SharedService.objA); //Prints "value1 modified"
}

    Hoffe, das hilft.

    InformationsquelleAutor der Antwort DILIP KOSURI

Schreibe einen Kommentar