Angular Js - LocalStorage
I am new to Angular, I have a simple question to pass LocalStorage to AngularJS. I have a json file to get data in the DOM and I already have LocalStorage.getItem working and displaying in the console.
Now I need to figure out how to get this LocalStorage in Dom after clicking a simple button.
This is my controller for the file:
angular.module('stock').controller('checkListController', [
'$http',
'checkListService',
function checkListController($http, checkListService) {
'use strict';
var self = this;
this.checkList = [];
$http.get('api/checklist.json').then(function (result) {
self.checkList = result.data.items;
});
this.checkListMissing = [];
$http.get('api/checklist-missing.json').then(function (result) {
self.checkListMissing = result.data.items;
});
var addList = [];
var missingItemList = [];
this.addItem = function (item) {
addList.push(item);
localStorage.setItem('item', JSON.stringify(addList));
missingItemList = addList;
console.log(missingItemList);
}
}
]);
It makes sense? Thanks everyone.
+3
source to share
1 answer
angular.module('stock').controller('checkListController', [ '$http','$window', 'checkListService', function checkListController($http,$window, checkListService) { 'use strict';
var self = this;
this.checkList = [];
$http.get('api/checklist.json').then(function (result) {
self.checkList = result.data.items;
});
this.checkListMissing = [];
$http.get('api/checklist-missing.json').then(function (result) {
self.checkListMissing = result.data.items;
});
var addList = [];
var missingItemList = [];
this.addItem = function (item) {
addList.push(item);
localStorage.setItem('item', JSON.stringify(addList));
missingItemList = addList;
console.log(missingItemList);
}
//this function will call when a button will click
$scope.showJsonContent = function() {
$scope.jsonDataFrmLclStorage = JSON.parse($window.localStorage.getItem("item"));
}
}
])
HTML need for button which will call the showJsonContent function expose in scope would be below
<button data-ng-click="showJsonContent()" >Show Content</button>
this will display the whole json data object {{}} JsonDataFrmLclStorage
0
source to share