Skip to content
AngularJS wrapper for storing JSON objects in the client browser with HTML5 localStorage.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist
src
.gitattributes
.gitignore
README.md
bower.json
package.json

README.md

Angular jStore

The angular-jstore module provides a convenient wrapper for to storing JSON objects in the client browser with HTML5 localStorage.

Install with package managers

via bower:

$ bower install angular-jstore --save

via npm:

$ npm install angular-jstore --save

How to use angular jstore

  • Add angular.min.js and angular-jstore.min.js(from the dist directory) to your code:
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script src="angular-jstore.min.js"></script>
  • Add a dependency to the angular-jstore module in your application.
var app = angular.module('myApp', ['angular-jstore']);
  • Setting a prefix for the session name (OPTIONAL)
// Jstore Provider
app.config(['$jstoreProvider', function ($jstoreProvider) {
    $jstoreProvider.setPrefix('appDemo');
}]);
  • To test see the example below:
app.controller('DemoCtrl', ['$scope', '$jstore', function($scope, $jstore) {

    var SESSION_NAME = 'YourSessionName';

    // Check browser support for localStorage
    if (!$jstore.isSupported) {
        alert('Your browser does not support HTML5 Web Storage. Please upgrade to a modern browser.');
        angular.element('body').empty();
        return;
    }

    // Add data in session localStorage
    $jstore.set(SESSION_NAME, { year: '2016' });

    // Display the value in the console
    console.log($jstore.get(SESSION_NAME).year);

    // Change session data
    $jstore.set(SESSION_NAME, { year: '2017' });

    // Display the value in the console
    console.log($jstore.get(SESSION_NAME).year);

    // Personal data
    var personalData = {
        'firstName': 'John',
        'lastName': 'Doe',
        'age': '35',
        'gender': 'male',
        'profession': 'Programmer'
    };

    // Add more data in session
    $jstore.set(SESSION_NAME, personalData);

    // Add Array data in session
    $jstore.set(SESSION_NAME, { magazine: ['FORBES', 'VOGUE'] });

    // Deletes from the session the pair-value by the keys
    $jstore.del(SESSION_NAME, 'profession', 'gender');

    // Deletes from session all pairs-value except for the keys
    $jstore.omit(SESSION_NAME, 'firstName', 'year', 'magazine');

    // Check if you have data in session
    var hasData = $jstore.has(SESSION_NAME);

    // Recover data from session
    var data = $jstore.get(SESSION_NAME);

    // Displays the values in the console
    console.log(data.firstName);
    console.log(data.magazine[0]);

    // Count total sessions created
    var count = $jstore.count();

    // Displays data for all created sessions
    $jstore.each(function (k, v) {
        console.log(k, ':', v);
    });

    // Clears data from a specific session in localStorage
    $jstore.remove(SESSION_NAME);

    // Clears all data from the localStorage
    $jstore.clear();

}]);

Console Output

Console

License

Released under the terms of MIT License.

See MIT license

You can’t perform that action at this time.