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

我有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数据和应切换到单选按钮显示在屏幕上？

来源

2017-08-01 P J

尝试使用[角本地存储（https://github.com/grevory/angular-local-storage）代替'localStorage' – Maher

JSON.stringyfy？应该是JSON.stringify – Fetrarij

为什么你不使用'角度服务“呢？ –

您应该使用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); 
} 
})

来源

2017-08-01 05:54:53

这没有奏效，当我点击其他单选按钮，我没有得到该电台保存的数据。 –

@PJ您应该使用angular.watch并在更改时设置该值。 –

可以使用的setObject（）：

import { Component, OnInit } from '@angular/core'; 

import { CoolLocalStorage } from 'angular2-cool-storage'; 

@Component({ 
    selector: 'my-app' 
}) 
export class AppComponent implements OnInit { 
    localStorage: CoolLocalStorage; 

    constructor(localStorage: CoolLocalStorage) { 
     this.localStorage = localStorage; 
    } 

    ngOnInit() { 
     this.localStorage.setItem('itemKey', 'itemValue'); 

     console.log(this.localStorage.getItem('itemKey')); 

     this.localStorage.setObject('itemKey', { 
      someObject: 3 
     }); 

     console.log(this.localStorage.getObject('itemKey')); 
    } 
}

了解更多详情：

https://www.npmjs.com/package/angular2-cool-storage

来源

2017-08-01 05:55:14

Op正在使用AngularJS。 –

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

回答

相关问题