¿Cómo almaceno un contexto de usuario actual en AngularJS?

Tengo un AuthService, que inicia sesión en un usuario, devuelve un objeto json de usuario. Lo que quiero hacer es establecer ese objeto y tener todos los cambios reflejados en la aplicación (estado de inicio / final de sesión) sin tener que actualizar la página.

¿Cómo podría lograr esto con AngularJS?

La forma más fácil de lograr esto es mediante el uso de un servicio. Por ejemplo:

app.factory( 'AuthService', function() { var currentUser; return { login: function() { ... }, logout: function() { ... }, isLoggedIn: function() { ... }, currentUser: function() { return currentUser; } ... }; }); 

A continuación, puede hacer referencia a esto en cualquiera de sus controladores. El siguiente código observa los cambios en un valor del servicio (llamando a la función especificada) y luego sincroniza los valores modificados con el scope.

 app.controller( 'MainCtrl', function( $scope, AuthService ) { $scope.$watch( AuthService.isLoggedIn, function ( isLoggedIn ) { $scope.isLoggedIn = isLoggedIn; $scope.currentUser = AuthService.currentUser(); }); }); 

Y luego, por supuesto, puede usar esa información como mejor le parezca; por ejemplo, en directivas, en plantillas, etc. Puede repetir esto (personalizado para lo que necesita hacer) en sus controladores de menú, etc. Todo se actualizará automáticamente cuando cambie el estado en el servicio.

Cualquier cosa más específica depende de tu implementación.

¡Espero que esto ayude!

Me gustaría enmendar la buena respuesta de Josh al agregar que, como un AuthService suele ser de interés para cualquiera (digamos, cualquiera excepto la vista de inicio de sesión debe desaparecer si nadie está conectado), tal vez una alternativa más simple sería notificar a las partes interesadas utilizando $rootScope.$broadcast('loginStatusChanged', isLoggedIn); (1) (2), mientras que las partes interesadas (como los controladores) escucharían usando $scope.$on('loginStatusChanged', function (event, isLoggedIn) { $scope.isLoggedIn = isLoggedIn; } .

(1) $rootScope siendo inyectado como argumento del servicio

(2) Tenga en cuenta que, en el caso probable de una operación de inicio de sesión asincrónico, querrá notificar a Angular que la transmisión cambiará las cosas, incluyéndola en una función $rootScope.$apply() .

Ahora, hablando de mantener el contexto del usuario en todos los controladores, puede que no esté contento escuchando los cambios de inicio de sesión en todos ellos, y podría preferir escuchar solo en un controlador de inicio de sesión superior, y luego agregar otros controladores de inicio de sesión como hijos / Controladores integrados de este. De esta forma, el controlador de los niños podrá ver las propiedades heredadas $ scope como su contexto de usuario.