angular.js stockage local - initialiser l'application de récupération des données stockées localement

Question

Je suis assez nouveau à angulaire et j'essaie d'éviter de perdre des éléments ajoutés sur une application de panier simple lorsque l'utilisateur actualise la page.

J'utilise angularLocalStorage (https://github.com/agrublev/angularLocalStorage) mais je ne sais pas comment récupérer le contenu. Mes lignes:

var myApp = angular.module('ionicApp', ['ionic','angularLocalStorage']); 
myApp.factory('prodottiData', function($http) { 
    return { 
    getFooOldSchool: function(callback) { 
    $http.get('http://192.168.1.128/hongkongapp/?json=get_recent_posts&post_type=product&custom_fields=all').success(callback); 
    } 
    } 
}); 
myApp.factory('DataService', function() { 
    var myCart = new shoppingCart("AngularStore"); 
    return { 
    cart : myCart 
    }; 
}); 
myApp.controller('MyController', function MyController ($scope, storage, $ionicSideMenuDelegate, prodottiData, DataService, $sce) { 
    $scope.toggleLeft = function() { 
    $ionicSideMenuDelegate.$getByHandle('mainMenu').toggleLeft(); 
    }; 
    $scope.toggleMySecondMenuLeft = function() { 
    $ionicSideMenuDelegate.$getByHandle('mySecondMenu').toggleLeft(); 
    }; 
    //adding menu data to the scope object 
    prodottiData.getFooOldSchool(function(data) { 
     $scope.menu = data; 
    }); 
    //adding the cart to the scope object 
    $scope.cart = DataService.cart; 
    $scope.to_trusted = function(html_code) { 
     return $sce.trustAsHtml(html_code); 
    } 
    images = $scope.menu; 
    $scope.showloader = function(){    
      $scope.shownImage = this.post.thumbnail_images.full.url; 
      $scope.itemDesc = this.post.content; 
      $scope.itemPrice = this.post.custom_fields._price[0]; 
      $scope.productName = this.post.title; 
      $scope.skuProdotto = this.post.id; 
     } 
    }); 

Maintenant, si je vérifie localStorage sur la console que je peux voir quelque chose est vraiment stocké, mais je manque la façon de repeupler le panier au démarrage.

Toute aide serait géniale!

Answer 1

De la documentation, pour récupérer, il est storage.get('key')

Alors, pour vérifier après rafraichissement

if (storage.get('someKey')){ 
    $scope.retrieved_value = storage.get('someKey'); 
}else{ 
// whatever 
} 

Answer 2

pourquoi ne pas simplement en utilisant le navigateur de stockage local? vous pouvez l'ajouter à votre service.js comme un nouveau service et juste l'utiliser.

var storeService = myAppServices.factory('storeService', function() { 

    var service = 
    { 
     setClientData:function(client_details) 
     { 
      window.localStorage.setItem("client_data", JSON.stringify(client_details)); 
      client_data = client_details; 
     }, 
     getClientData:function() 
     { 
      if (client_data == null) 
      { 
       client_data = JSON.parse(window.localStorage.getItem("client_data")); 
      } 
      return client_data; 
     } 
    } 

    var client_data = null; 

    return service; 
}); 

Answer 3

Vous pouvez utiliser localStorage à la place de windows.localStorage.

if(typeof(Storage)!=="undefined") 
 
     { 
 
      // Code for localStorage/sessionStorage. 
 
      var hello = "Hello World!!"; 
 

 
      localStorage.setItem("hello",hello); 
 
      // get string 
 
      console.log(localStorage.getItem("hello")); // will return 'Hello World!!' 
 

 

 
      var me = {name:'abel',age:26,gender:'male'}; 
 
      localStorage.setItem("user", JSON.stringify(me)); 
 
      //fetch object 
 
      console.log(localStorage.getItem("user")); // will return {"name":"myname","age":99,"gender":"myGender"} 
 
      var objetos = JSON.parse(localStorage.getItem("user")); 
 
      console.log(objetos.name); 
 

 
     } 
 
     else 
 
     { 
 
      // Sorry! No Web Storage support.. 
 
     }