如何使用Angularjs将数据存储在本地存储中？

目前，我正在使用服务来执行操作，即从服务器检索数据，然后将数据存储在服务器本身上。

而不是这个，我想把数据放入本地存储，而不是将其存储在服务器上。 我如何做到这一点？

Answer 1

这是我的代码存储和检索本地存储的一点。 我使用广播事件来保存和恢复模型中的值。

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("restorestate", service.RestoreState); return service; }]); 

Answer 2

如果使用$window.localStorage.setItem(key,value)存储， $window.localStorage.getItem(key)检索和$window.localStorage.removeItem(key)则可以访问任何页面中的值。

您必须将$window服务传递给控制器​​，尽pipe在JavaScript window对象是全局可用的。

通过使用$window.localStorage.xxXX() ，用户可以控制localStorage值。 数据的大小取决于浏览器。 但是，如果仅使用$localStorage那么只要您使用window.location.href导航到其他页面，并且如果使用<a href="location"></a>导航到其他页面，那么值就会保持不变，然后您的$localStorage价值在下一页丢失。

Answer 3

对于本地存储有一个模块，看看下面的url：

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

和其他链接的HTML5本地存储和angularJs

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

Answer 4

使用ngStorage您所有的AngularJS本地存储需求。 请注意，这不是Angular JS框架的本地部分。

ngStorage包含两个服务：$ localStorage和$ sessionStorage。

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

检查演示

Answer 5

还有另一个模块比ngStorage有更多的活动

angular本地存储：

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

Answer 6

根据你的需要，如果你想让数据最终过期或设置限制多lesslogging存储，你也可以看看https://github.com/jmdobry/angular-cache ，它允许你定义如果caching位于内存，localStorage或sessionStorage中。

Answer 7

我创作了（又一个）有angular度的html5存储服务。 我希望保持ngStorage所做的自动更新，但是要使消化循环更加可预测/直观（至less对于我来说），添加要处理状态重新加载的事件，还要在选项卡之间添加共享会话存储。 我在$ resource之后build模API，并将其称为angular存储对象。 它可以使用如下：

  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

回购： https ： //github.com/yaacovCR/angular-stored-object

希望它可以帮助别人！

Answer 8

你可以使用localStorage来达到目的。

脚步：

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