JavaScript ExampleJavaScript
    if(typeof(Storage) != "undefined") {
        localStorage.setItem("firstname", "Nic");
        localStorage.setItem("lastname", "Raboy");
        alert(localStorage.getItem("firstname") + " " + localStorage.getItem("lastname"));
    } else {
        alert("Sorry, your browser does not support Web Storage...");
    }


You can easily use the setItem, getItem, and removeItem methods to manage your data. The good news is you can use those same commands with IonicFramework.

app.jsJavaScript
    myApp.controller('Login', function($scope) {
        $scope.login = function(username, password) {
            window.localStorage.setItem("username", username);
            window.localStorage.setItem("password", password);
        };
   
        $scope.isLoggedIn = function() {
            if(window.localStorage.getItem("username") !== undefined && window.localStorage.getItem("password") !== undefined) {
                return true;
            } else {
                return false;
            }
        };
   
        $scope.logout = function() {
            window.localStorage.removeItem("username");
            window.localStorage.removeItem("password");
        };
    });


But what happens if you want to store complex data. For example what if you wanted to store data from an $http.get request to cache in the event no internet is available in the future.

app.jsJavaScript
    myApp.controller('Profile', function($scope, $http) {
        $http.get("https://api.example.com/profile";, { params: { "api_key": "some_key_here" } })
            .success(function(data) {
                $scope.profile = data;
                window.localStorage.setItem("profile", JSON.stringify(data));
            })
            .error(function(data) {
                if(window.localStorage.getItem("profile") !== undefined) {
                    $scope.profile = JSON.parse(window.localStorage.getItem("profile"));
                }
            });
    });


Given above is an example of a fictional API request that gets a users profile. After the success of the GET request, we can store the result in the scope and a local storage bucket. But, the raw object just can't be stored into local storage. Firstly, JSON.stringify command has to be used to serialize. This leads to creation of a flat string instead of an object. Now when the the profile API is called a second time, but the mobile device’s internet isn’t stable or it doesn’t exist. Now lets say The error callback will happen and if the local profile bucket exists, JSON.parse will un-flatten it and store it in our scope. Besides seeing possibly older data, the user won’t even know that there was a problem.