2013-07-07 7 views
4

У меня есть одностраничное приложение с аутентификацией пользователя, и там нет проблем с информацией о сеансе обмена.Как сохранить сеанс в многострочном угловом приложении?

Однако у меня есть часть сайта, где есть статические страницы, где я хотел бы просто включить информацию о сеансе (зарегистрированный пользователь или форму входа). Как я могу делиться информацией о сеансе между двумя приложениями?

ответ

12

Я бы рекомендовал создать сервис, который обертывает localStorage или другой apis для хранения постоянных данных. Here - пример использования реализации localStorage.

Эта реализация синхронное, но если я буду использовать websql как или даже сервер БД, то я бы реорганизовать его использовать promises вернуть объект хранения.

Контроллер

var demo = angular.module('demo', [ 'appStorage' ]); 

demo.controller('AppStorageController', [ '$scope', 'appStorage', 
    function($scope, appStorage) { 
     appStorage('MyAppStorage', 'myAppStorage', $scope); 
    } ]); 

HTML

<div ng-controller="AppStorageController"> 
    <p>Local Storage: {{myAppStorage}}</p> 
    <p> 
    Username: <input type="text" ng-model="myAppStorage.username"></input> 
    </p> 
    <p> 
    Remember me: <input type="checkbox" 
     ng-model="myAppStorage.rememberMe"></input> 
    </p> 
</div> 

JS

angular.module('appStorage', []).factory('appStorage', 
    [ '$window', function($window) { 
     var appStorages = {}; 
     var api = undefined; 

     if ($window.localStorage) { 
     api = { 
      set : function(name, value) { 
      $window.localStorage.setItem(name, JSON.stringify(value)); 
      }, 
      get : function(name) { 
      var str = $window.localStorage.getItem(name); 
      var val = {}; 
      try { 
       val = str ? JSON.parse(str) : {}; 
      } 
      catch (e) { 
       console.log('Parse error for localStorage ' + name); 
      } 
      return val; 
      }, 
      clear : function() { 
      $window.localStorage.clear(); 
      } 
     }; 
     } 
     // possibly support other 

     if (!api) { 
     throw new Error('Could not find suitable storage'); 
     } 

     return function(appName, property, scope) { 
     if (appName === undefined) { 
      throw new Error('appName is required'); 
     } 

     var appStorage = appStorages[appName]; 

     var update = function() { 
      api.set(appName, appStorage); 
     }; 

     var clear = function() { 
      api.clear(appName); 
     }; 

     if (!appStorage) { 
      appStorage = api.get(appName); 
      appStorages[appName] = appStorage; 
      update(); 
     } 

     var bind = function(property, scope) { 
      scope[property] = appStorage; 
      scope.$watch(property, function() { 
      update(); 
      }, true); 
     }; 

     if (property !== undefined && scope !== undefined) { 
      bind(property, scope); 
     } 

     return { 
      get : function(name) { 
      return appStorage[name]; 
      }, 
      set : function(name, value) { 
      appStorage[name] = value; 
      update(); 
      }, 
      clear : clear 
     }; 
     }; 
    } ]); 
+0

Как я мог очистить свойство или приложение для хранения с помощью т его службу «appStorage». Например, если я создал приложение 'FooStorage' и разместил в нем' bar'-свойство в '$ scope', используя' appStorage ('FooStorage', 'bar', $ scope); 'то что я могу сделать, чтобы очистить просто свойство 'bar', и что, если мне нужно очистить весь« FooStorage »? – skip

+1

@skip Я бы добавил метод removeApp в api, который будет называть localStorage.removeItem именем приложения в этом случае FooStorage. Если вы хотите удалить свойство, добавьте метод удаления, который удалит свойство на карте, а затем сохранит значение localStorage. –

+0

Если у меня есть 'var fooStore = appStorage ('FooStorage', 'bar', $ scope);', должен вызывать 'fooStore.clear();' не очистить все данные, хранящиеся в 'fooStore'? Я получаю сохраненные данные даже после перезагрузки страницы после вызова 'fooStore.clear();'. Как я могу удалить все данные из 'fooStore'? Благодарю. – skip