Angularjs, pasando alcance entre rutas

Tengo una situación con un formulario que se extiende a lo largo de varias páginas (puede que no sea ideal, pero así es). Me gustaría tener un alcance para todo el formulario que se completa a medida que avanza, de modo que si el usuario va y viene entre los pasos, sea fácil recordar el estado.

Así que tengo que hacer, en muy pseudocódigo:

1. Conjunto $scope.val = <Some dynamic data>
2. Haga clic en un enlace y sea dirigido a una nueva plantilla (probablemente con el mismo controlador).
3. $scope.val debería seguir siendo el mismo valor que tenía en la última página.

¿Es la persistencia de datos para el alcance la forma correcta de hacerlo o hay alguna otra forma? ¿Puede incluso crear un controlador que tenga un alcance persistente entre rutas, excepto para guardarlo en una base de datos, por supuesto?

Necesita utilizar un servicio, ya que este permanecerá durante toda la vida de su aplicación.

Supongamos que desea guardar datos pertenecientes a un usuario

Así es como se define el servicio:

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

En tu primer controlador:

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";

    });

El servicio funcionará, pero una forma lógica de hacerlo utilizando solo alcances y controladores ordinarios es configurar sus controladores y elementos para que reflejen la estructura de su modelo. En particular, necesita un elemento principal y un controlador que establezcan un alcance principal. Las páginas individuales del formulario deben residir en una vista que sea secundaria para el padre. El ámbito principal persiste incluso cuando se actualiza la vista secundaria.

Supongo que está utilizando ui-router para que pueda tener vistas con nombre anidadas. Luego, en pseudocódigo:

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

Luego, WizardController define las variables de alcance que desea conservar en los pasos del formulario de varias páginas (al que me refiero como un "asistente"). Entonces tus rutas se actualizaránstepView solo . Cada paso puede tener sus propias plantillas, controladores y ámbitos, pero sus ámbitos se pierden de una página a otra. Pero los ámbitos de WizardController se conservan en todas las páginas.

Para actualizar los ámbitos de WizardController desde los controladores secundarios, necesitará usar una sintaxis como $scope.$parent.myProp = 'value'o definir una función setMyPropen WizardController para cada variable de ámbito. De lo contrario, si intenta establecer las variables de alcance principal directamente desde los controladores secundarios, terminará creando una nueva variable de alcance en el niño mismo, sombreando la variable principal.

Es un poco difícil de explicar y me disculpo por la falta de un ejemplo completo. Básicamente, desea un controlador principal que establezca un alcance principal, que se conservará en todas las páginas de su formulario.

Los datos se pueden pasar entre controladores de dos formas

1. $rootScope
2. Modelo

El siguiente ejemplo demuestra el paso de valores usando el modelo

app.js

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

SharedService.js

function SharedService($rootScope){

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

// Modifica el valor en el controlador A

Controller.js

function Controller($scope, SharedService){

 $scope.SharedService = SharedService;

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

// Accede al valor en controllertwo

ControllerTwo.js

function ControllerTwo($scope, SharedService){

 $scope.SharedService = SharedService;

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

Espero que esto ayude.