Detailed explanation of local storage of AngularJs data

1. Create an factory to store and retrieve your data (You can create a separate js file named semantically as: dataService. js. Then introduce this JS file into your main page)

<!-- Into your main page -->
<script src="dataService.js"></script>
 Create 1 A factory
'use strict';
angular.module('myApp')
.factory('datadService',['$window',function($window) {
 return{ 
 // Store a single attribute 
  set :function(key,value){
  $window.localStorage[key]=value;
  }, 
  // Read a single attribute 
  get:function(key,defaultValue){
  return $window.localStorage[key] || defaultValue;
  }, 
  // Stores objects to JSON Format storage 
  setObject:function(key,value){
  $window.localStorage[key]=JSON.stringify(value);
  }, 
  // Read object 
  getObject: function (key) {
  return JSON.parse($window.localStorage[key] || '{}');
  }
 }
}]);

2. Inject the method module you created "datadService" into the controller you want. The following controller is "productCtrl". Next, we create an set. js file with the following code:

'use strict';
angular.module('myApp').controller(
 'productCtrl',
 [ '$scope','datadService',
 function($scope, datadService) {
 $scope.appiAppType = 1;
 // In here $scope.appiAppType The assignment of can also be passed through $http.post Or $http.get
 // Such as the parameters returned by the method to assign values, as follows: 
 //$http.post(' Here is the interface you want to access. " URL " ', Here are the parameters you want to upload ).success(function(data){
   // $scope.appiAppType = data;
   //});
 datadService.setObject("lodinData", $scope.appiAppType);//  Store the data you get into the " datadService "In, in here" lodinData "Yes KEY (Personal understanding is that you store the data in a big box, which is " datadService ", in order to find the data you want better in this box, give it to him 1 A little label, that is, " lodinData ") 
 } ]);

3. As for how the stored data is obtained in different controls, let's create an get. js with the following code:

'use strict';
// First of all, everyone should put the module created before, that is, the box containing data. " datadService "Put it in this controller (that is, module injection) 
// Secondly, everyone passed the label we set before. " lodinData ", use" getObject('key') "Method to get the data you want; 
// The concrete realization is 1 Line code: datadService.getObject('lodinData'); "Note: Take out the box ( datadService ) Use ( getObject ) Go get this of yours ( lodinData ) Data under the tab " 
angular.module('myApp').controller(
 'completeCtrl',
 [ '$scope', 'datadService',
 function($scope, datadService) {
 // Here we get the data that has been stored above: " datadService.getObject('lodinData'); "And assigned this data to" $scope.LoginList " 
 $scope.LoginList = datadService.getObject('lodinData');
 // You can print it here 1 Under $scope.LoginList  See what is inside; 
 alert(JSON.stringify($scope.LoginList))
 } ]);