ngStorageを使ってみる #Angular

概要

AngularJSからLocalStorageを簡単に使えるようにするモジュール。
LocalStorageが使用できない場合、Cookieを代わりに使ってくれるらしい。

https://github.com/agrublev/angularLocalStorage

実際には「angularLocalStorage」っぽい。

準備

こちらを参考にAngularJSのプロジェクトの雛形を生成する。

$ bower install ngStorage --save

依存関係を追加する。

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

使ってみる

bind

自動で同期してくれる。

angular.module('myApp')
    .controller('myCtrl', function($scope, storage) {
        var defaultValue = {id: 1, name: 'hoge'};
       storage.bind($scope, 'myValue', {defaultValue: defaultValue});
    });

set

angular.module('myApp')
    .controller('myCtrl', function($scope, storage) {
        storage.set('test', {id: 1, name: 'hoge'});
    });

get

angular.module('myApp')
    .controller('myCtrl', function($scope, storage) {
        $scope.val = storage.get('test');
    });

clearAll

angular.module('myApp')
    .controller('myCtrl', function($scope, storage) {
        storage.clearAll();
    });

getKeys

angular.module('myApp')
    .controller('myCtrl', function($scope, storage) {
        console.log(storage.getKeys());
    });