Question

每当我刷新页面时，我都会发现，angular会重建整个模块。那么有没有办法永久存储一些数据。 cookie服务是唯一的方式吗？

Answer 1

你也可以像这样使用local storage：

localStorage.setItem('variable', 'stored value');
alert(localStorage['variable']);

Answer 2

我建议使用angular-local-storage，https://github.com/grevory/angular-local-storage。它提供了使用localstorage或sessionstorage的选项。

Answer 3

我认为你可以使用$ rootScope.It是最顶级的范围。一个应用程序只能有一个$ rootScope，它将在应用程序的所有组件之间共享。因此它就像一个全局变量。所有其他$范围都是$ rootScope的子代。

Answer 4

如果您的网站不必支持IE 7或更低版本，则使用localStorage或sessionStorage执行此操作非常简单，而无需引入其他库。

以下是https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

的快速示例

写入localStorage或sessionStorage：

localStorage.colorSetting = '#a4509b';
localStorage['colorSetting'] = '#a4509b';
localStorage.setItem('colorSetting', '#a4509b');

阅读

alert(localStorage.colorSetting);
alert(localStorage['colorSetting']);
alert(localStorage.getItem('colorSetting'));

删除和清除

localStorage.removeItem('colorSetting'); // remove only colorSetting
localStorage.clear(); // remove everything from local storage

localStorage和sessionStorage只能存储字符串，因此对象值在保存时必须序列化，并在访问时进行反序列化。

在Angular中，最好将其包装在类似于以下的服务中：

angular.module('WebStorage', []).factory('storage', ['$window', function($window) {
   var service = {
       local: wrapStorageApi($window.localStorage),
       session: wrapStorageApi($window.sessionStorage) 
   };

   function wrapStorageApi(storageMethod) {
       return {
           'set': function(key, value) {
               storageMethod.setItem(key, angular.toJson(value));
           },
           'get': function(key) {
               return angular.fromJson(storageMethod.getItem(key));
           },
           'remove': function(key) {
               storageMethod.removeItem(key);
           }
           'clear': function() {
               storageMethod.clear();
           }
       };
   }

   return service;
}]);

注意：要使用上述服务，应用模块必须包含'WebStorage'，如：

angular.module('myApp', ['WebStorage']);

现在有一种一致的方法可以将任何数据类型保存到Web存储中，可以这样使用：

angular.module('myApp').controller('MyAppController', ['storage', function(storage) {
   //saving item to local storage
   storage.local.set('item', { name: 'complex_object', id: 0 });   

   //getting item from local storage
   var item = storage.local.get('item');

   //removing item
   storage.local.remove('item');
}]);

如何在angularjs中永久存储数据

4 个答案: