¿Cómo almaceno datos en el almacenamiento local usando Angularjs?

Actualmente estoy usando un servicio para realizar una acción, es decir, recuperar datos del servidor y luego almacenar los datos en el servidor.

En lugar de esto, quiero poner los datos en el almacenamiento local en lugar de almacenarlos en el servidor. ¿Cómo hago esto?

esto es un poco de mi código que almacena y recupera en el almacenamiento local. utilizo eventos de difusión para guardar y restaurar los valores en el modelo.

app.factory('userService', ['$rootScope', function ($rootScope) { var service = { model: { name: '', email: '' }, SaveState: function () { sessionStorage.userService = angular.toJson(service.model); }, RestoreState: function () { service.model = angular.fromJson(sessionStorage.userService); } } $rootScope.$on("savestate", service.SaveState); $rootScope.$on("restrestate", service.RestoreState); return service; }]); 

Si usa $window.localStorage.setItem(key,value) para almacenar, $window.localStorage.getItem(key) para recuperar y $window.localStorage.removeItem(key) para eliminar, entonces puede acceder a los valores en cualquier página .

Debe pasar el servicio $window al controlador. Aunque en JavaScript, el objeto window está disponible globalmente.

Al usar $window.localStorage.xxXX() el usuario tiene control sobre el valor localStorage . El tamaño de los datos depende del navegador. Si solo usa $localStorage , el valor permanece siempre que use window.https://stackoverflow.com/questions/18247130/how-do-i-store-data-in-local-storage-using-angularjs/location.href para navegar a otra página y si usa para navegar a otra página, entonces su valor $localStorage se pierde en la página siguiente.

Para el almacenamiento local, hay un módulo para esa vista en la URL siguiente:

https://github.com/grevory/angular-local-storage

y otro enlace para almacenamiento local HTML5 y angularJs

http://www.amitavroy.com/justread/content/articles/html5-local-storage-with-angular-js/

Use ngStorage para todas sus necesidades de almacenamiento local AngularJS. Tenga en cuenta que esta NO es una parte nativa del marco Angular JS.

ngStorage contiene dos servicios: $ localStorage y $ sessionStorage.

 angular.module('app', [ 'ngStorage' ]).controller('Ctrl', function( $scope, $localStorage, $sessionStorage ){}); 

Verifica la Demo

Hay un módulo alternativo más que tiene más actividad que ngStorage

angular-local-storage:

https://github.com/grevory/angular-local-storage

Dependiendo de sus necesidades, por ejemplo, si desea permitir que los datos caduquen o establecer limitaciones sobre cuántos registros almacenar, también puede consultar https://github.com/jmdobry/angular-cache, que le permite definir si la memoria caché se encuentra en la memoria, localStorage o sessionStorage.

Fui autor (otro más) del servicio de almacenamiento angular html5. Quería mantener las actualizaciones automáticas hechas posibles por ngStorage, pero hacer que los ciclos de resumen sean más predecibles / intuitivos (al menos para mí), agregar eventos para manejar cuando se requieran recargas de estado y también agregar el almacenamiento de la sesión compartida entre tabs. Modelé la API después de $ resource y la llamé angular-stored-object. Se puede usar de la siguiente manera:

  angular .module('auth', ['yaacovCR.storedObject']); angular .module('auth') .factory('session', session); function session(ycr$StoredObject) { return new ycr$StoredObject('session'); } 

API: http://yaacovcr.github.io/angular-stored-object/docs/#/api

Repo: https://github.com/yaacovCR/angular-stored-object

Espero que ayude a alguien!

Puede usar localStorage para este propósito.

Pasos:

 add ngStorage.min.js in your file add ngStorage dependency in your module add $localStorage module in your controller use $localStorage.key = value 

Uno debe usar un script de terceros para este llamado llamado ngStorage. Aquí hay un ejemplo de cómo usarlo. Actualiza el almacenamiento local con cambios en el scope / vista.