如何在localStorage中存储对象数组？

Question

我有3个单选按钮说x,y和z.在click上x,数据加载等..

现在在localStorage中,我想为其设置数据x,y并以z不同方式获取数据.

在这里,我将提供该计划的样本.

使用Javascript:

var setInLocalStorage = function(){
    //on click of  x radio and getting data from model and called 
    // from one  function
    var x = {
        t = model.x.t;
        d = model.x.d;
    }
    localStorage.setItem('x' ,JSON.stringyfy(x));
}

var getFromLocalStorage = function() { 
    var obj = JSON.parse(localStorage.getItem('x'));
    //storing back to model
    model.x.t = obj.t;
    model.x.d = obj.d; 
    // populating data on screen which was stored in local storage
    $scope.x.t = model.x.t ;
    $scope.x.d = model.x.d;
}

如何存储y和z切换到单选按钮时屏幕上显示的数据？

Answer 1

你应该使用JSON.stringify和JSON.parse.您的代码上有拼写错误,您无需设置每个属性.只需设置x范围.

var setInLocalStorage = function(){
    var x =  model.x
    localStorage.setItem('x', JSON.stringify(x));
}

var getFromLocalStorage = function() { 
    var obj = JSON.parse(localStorage.getItem('x'));
    model.x = obj;
    $scope.x = model.x;
}

但最佳做法是不要在控制器中执行这些类型的操作.你应该使用angular.factory或angular.service为此.

在你的x-storage.js中

angular.factory('xStorage', function(){
 var x = localStorage.getItem('x') || {};
 return {
  getX: function(){
    return x;
  },
  setX: function(xData){
    x = xData;
    localStorage.setItem('x', xData);
  }
 }
})

在你的controller.js中

angular.controller('controllerName', function(xStorage){
 $scope.x = xStorage.getX();

 $scope.clickButton = function(anyValue) {
   xStorage.setX(anyValue);
 }
})