回答:
これは、ローカルストレージに保存および取得するコードの一部です。ブロードキャストイベントを使用して、モデルの値を保存および復元します。
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;
}]);sessionStorage≠localStorage
を使用$window.localStorage.setItem(key,value)して保存、$window.localStorage.getItem(key)取得、および$window.localStorage.removeItem(key)削除する場合は、任意のページの値にアクセスできます。
$windowサービスをコントローラーに渡す必要があります。JavaScriptでは、windowオブジェクトはグローバルに使用できます。
$window.localStorage.xxXX()ユーザーを使用することにより、localStorage値を制御できます。データのサイズはブラウザによって異なります。のみを使用する場合$localStorage、window.location.hrefを使用して他のページに移動する限り値は残り、を使用<a href="location"></a>して他のページに移動する$localStorageと、次のページで値が失われます。
ローカルストレージの場合は、以下のURLにそのためのモジュールがあります。
https://github.com/grevory/angular-local-storage
HTML5ローカルストレージとangularJsのその他のリンク
http://www.amitavroy.com/justread/content/articles/html5-local-storage-with-angular-js/
使用ngStorageのためにすべてのあなたのAngularJSローカルストレージのニーズ。これは、Angular JSフレームワークのネイティブ部分ではないことに注意してください。
ngStorage 2つのサービスを含み$localStorage、$sessionStorage
angular.module('app', [
'ngStorage'
]).controller('Ctrl', function(
$scope,
$localStorage,
$sessionStorage
){});デモを確認する
より多くのアクティビティを持つ代替モジュールが1つあります ngStorage
角度ローカルストレージ：
localStorage目的に使用できます。
手順：
（別の）角度のあるhtml5ストレージサービスを作成しました。によって可能になった自動更新を維持したいと思っていましたngStorageが、ダイジェストサイクルを（少なくとも私にとっては）予測可能/直感的にし、状態の再読み込みが必要なときに処理するイベントを追加し、タブ間の共有セッションストレージを追加しました。私は後にAPIをモデル化して$resource呼び出しましたangular-stored-object。次のように使用できます。
angular
.module('auth', ['yaacovCR.storedObject']);
angular
.module('auth')
.factory('session', session);
function session(ycr$StoredObject) {
return new ycr$StoredObject('session');
}APIはこちらです。
レポはこちら。
それが誰かを助けることを願っています！
必要に応じて、データを最終的に期限切れにしたり、保存するレコードの数に制限を設定したりする場合は、https：//github.com/jmdobry/angular-cacheを見て、以下を定義できます。キャッシュは、memory、localStorage、またはsessionStorageにあります。
これにはngStorageと呼ばれるサードパーティのスクリプトを使用する必要があります。ここでは使用方法の例を示します。スコープ/ビューの変更でlocalstorageを更新します。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<!-- CDN Link -->
<!--https://cdnjs.cloudflare.com/ajax/libs/ngStorage/0.3.6/ngStorage.min.js-->
<script src="angular.min.js"></script>
<script src="ngStorage.min.js"></script>
<script>
var app = angular.module('app', ['ngStorage']);
app.factory("myfactory", function() {
return {
data: ["ram", "shyam"]
};
})
app.controller('Ctrl', function($scope, $localStorage, $sessionStorage, myfactory) {
$scope.abcd = $localStorage; //Pass $localStorage (or $sessionStorage) by reference to a hook under $scope
// Delete from Local Storage
//delete $scope.abcd.counter;
// delete $localStorage.counter;
// $localStorage.$reset(); // clear the localstorage
/* $localStorage.$reset({
counter: 42 // reset with default value
});*/
// $scope.abcd.mydata=myfactory.data;
});
</script>
</head>
<body ng-app="app" ng-controller="Ctrl">
<button ng-click="abcd.counter = abcd.counter + 1">{{abcd.counter}}</button>
</body>
</html>