- Notifications
You must be signed in to change notification settings - Fork581
An AngularJS module that gives you access to the browsers local storage with cookie fallback
License
grevory/angular-local-storage
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
An Angular module that gives you access to the browsers local storage
- Get Started
- Video Tutorial
- Development
- Configuration
- setPrefix
- setStorageType
- setDefaultToCookie
- setStorageCookie
- setStorageCookieDomain
- setNotify
- Example
- API Documentation
- isSupported
- [changePrefix]
- getStorageType
- set
- get
- keys
- remove
- clearAll
- bind
- deriveKey
- length
- cookie
(1) You can install angular-local-storage using 3 different ways:
Git:clone & buildthis repository
Bower:
$ bower install angular-local-storage --save
npm:
$ npm install angular-local-storage
(2) Includeangular-local-storage.js (orangular-local-storage.min.js) from thedist directory in yourindex.html, after including Angular itself.
(3) Add'LocalStorageModule' to your main module's list of dependencies.
When you're done, your setup should look similar to the following:
<!doctype html><htmlng-app="myApp"><head></head><body> ...<scriptsrc="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script><scriptsrc="bower_components/js/angular-local-storage.min.js"></script> ...<script>varmyApp=angular.module('myApp',['LocalStorageModule']);</script> ...</body></html>
You could set a prefix to avoid overwriting any local storage variables from the rest of your app
Default prefix:ls.<your-key>
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setPrefix('yourAppName');});
You could change web storage type to localStorage or sessionStorage
Default storage:localStorage
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setStorageType('sessionStorage');});
If localStorage is not supported, the library will default to cookies instead. This behavior can be disabled.
Default:true
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setDefaultToCookie(false);});
Set cookie options (usually in case of fallback)
expiry: number of days before cookies expire (0 = session cookie).default:30
path: the web path the cookie represents.default:'/'
secure: whether to store cookies as secure.default:false
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setStorageCookie(45,'<path>',false);});
Set the cookie domain, since this runs inside a theconfig() block, only providers and constants can be injected. As a result,$location service can't be used here, use a hardcoded string orwindow.location.
No default value
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setStorageCookieDomain('<domain>');});
For local testing (when you are testing on localhost) set the domain to an empty string ''. Setting the domain to 'localhost' will not work on all browsers (eg. Chrome) since some browsers only allow you to set domain cookies for registry controlled domains, i.e. something ending in .com or so, but not IPsor intranet hostnames like localhost.
Configure whether events should be broadcasted on $rootScope for each of the following actions:
setItem , default:true, event "LocalStorageModule.notification.setitem"
removeItem , default:false, event "LocalStorageModule.notification.removeitem"
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setNotify(true,true);});
Using all together
myApp.config(function(localStorageServiceProvider){localStorageServiceProvider.setPrefix('myApp').setStorageType('sessionStorage').setNotify(true,true)});
Checks if the browser support the current storage type(e.g:localStorage,sessionStorage).Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...if(localStorageService.isSupported){//...}//...});
Change the local storage prefix during executionReturns:Null
myApp.controller('MainCtrl',function($scope,localStorageService){//...localStorageService.setPrefix('newPrefix');//...});
Returns:String
myApp.controller('MainCtrl', function($scope, localStorageService) { //... var storageType = localStorageService.getStorageType(); //e.g localStorage //...});You can also dynamically change storage type by passing the storage type as the last parameter for any of the API calls. For example:localStorageService.set(key, val, "sessionStorage");
Directly adds a value to local storage.
If local storage is not supported, use cookies instead.
Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...functionsubmit(key,val){returnlocalStorageService.set(key,val);}//...});
Directly get a value from local storage.
If local storage is not supported, use cookies instead.
Returns:value from local storage
myApp.controller('MainCtrl',function($scope,localStorageService){//...functiongetItem(key){returnlocalStorageService.get(key);}//...});
Return array of keys for local storage, ignore keys that not owned.
Returns:value from local storage
myApp.controller('MainCtrl',function($scope,localStorageService){//...varlsKeys=localStorageService.keys();//...});
Remove an item(s) from local storage by key.
If local storage is not supported, use cookies instead.
Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...functionremoveItem(key){returnlocalStorageService.remove(key);}//...functionremoveItems(key1,key2,key3){returnlocalStorageService.remove(key1,key2,key3);}});
Remove all data for this app from local storage.
If local storage is not supported, use cookies instead.
Note: Optionally takes a regular expression string and removes matching.
Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...functionclearNumbers(key){returnlocalStorageService.clearAll(/^\d+$/);}//...functionclearAll(){returnlocalStorageService.clearAll();}});
Bind $scope key to localStorageService.Usage:localStorageService.bind(scope, property, value[optional], key[optional])key: The corresponding key used in local storageReturns: deregistration function for this listener.
myApp.controller('MainCtrl',function($scope,localStorageService){//...localStorageService.set('property','oldValue');$scope.unbind=localStorageService.bind($scope,'property');//Test Changes$scope.update=function(val){$scope.property=val;$timeout(function(){alert("localStorage value: "+localStorageService.get('property'));});}//...});
<divng-controller="MainCtrl"><p>{{property}}</p><inputtype="text"ng-model="lsValue"/><buttonng-click="update(lsValue)">update</button><buttonng-click="unbind()">unbind</button></div>
Return the derive keyReturnsString
myApp.controller('MainCtrl',function($scope,localStorageService){//...localStorageService.set('property','oldValue');//Test Resultconsole.log(localStorageService.deriveKey('property'));// ls.property//...});
Return localStorageService.length, ignore keys that not owned.ReturnsNumber
myApp.controller('MainCtrl',function($scope,localStorageService){//...varlsLength=localStorageService.length();// e.g: 7//...});
Deal with browser's cookies directly.
Checks if cookies are enabled in the browser.Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...if(localStorageService.cookie.isSupported){//...}//...});
Directly adds a value to cookies.
Note: Typically used as a fallback if local storage is not supported.
Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...functionsubmit(key,val){returnlocalStorageService.cookie.set(key,val);}//...});
Cookie Expiry Pass a third argument to specify number of days to expiry
localStorageService.cookie.set(key,val,10)
sets a cookie that expires in 10 days.Secure Cookie Pass a fourth argument to set the cookie as secureW3C
localStorageService.cookie.set(key,val,null,false)
sets a cookie that is secure.
Directly get a value from a cookie.
Returns:value from local storage
myApp.controller('MainCtrl',function($scope,localStorageService){//...functiongetItem(key){returnlocalStorageService.cookie.get(key);}//...});
Remove directly value from a cookie.
Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...functionremoveItem(key){returnlocalStorageService.cookie.remove(key);}//...});
Remove all data for this app from cookie.
Returns:Boolean
myApp.controller('MainCtrl',function($scope,localStorageService){//...functionclearAll(){returnlocalStorageService.cookie.clearAll();}});
Check out the full demo athttp://gregpike.net/demos/angular-local-storage/demo.html
- Don't forget about tests.
- If you're planning to add some feature please create an issue before.
Clone the project:
$ git clone https://github.com/<your-repo>/angular-local-storage.git$ npm install$ bower install
Run the tests:
$ grunttestDeploy:
Run the build task, update version before(bower,package)
$ npm version patch|minor|major$ grunt dist$ git commit [message]$ git push origin master --tags
About
An AngularJS module that gives you access to the browsers local storage with cookie fallback
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.