CODEWITHSUNDEEP
javascriptangularjs
Niranjan Godbole
Niranjan Godbole

Reputation: 2175

How to store data in angularjs application?

Folder StuctureHi I am developing my first Angularjs application. I want to save data in Angularjs application for later use(I have used localstorage in jquery before). For example, I will make ajax call and i will get some data, Lets say below example,

  $http.post('http://192.168.0.213:1234/api/VerifyUser', $stateParams.pageList).then(function (response) {
                alert(response.data);

another example, After succesfull login i will get some ID in response and i want to preserve this data all over the application. This ID i may use in all subsequent ajax calls. I will get some data in response and i want to make use that data in other controllers as well. Is there any way i can do this? any help would be appreciated. Thank you.

Upvotes: 1

Views: 95

Answers (3)

Rajath M S
Rajath M S

Reputation: 1092

you can store it in factory like below,

After your Ajax call

$http.post('http://192.168.0.213:1234/api/VerifyUser', $stateParams.pageList).then(function (response) {

                alert(response.data)
SomeFactory.setData(response.data);
};

SomeFactory

    (function () {
  'use strict';

  angular
    .module('app.myApp')
    .factory('SomeFactory', SomeFactory);

  SomeFactory.$inject = [];

  function SomeFactory() {
    var someData;

    var factory = {
      setData: setData,
      getData: getData
    };



    function setData(data) {
      someData = data;
    }

    function getData() {
      return someData;
    }

    return factory;
  }
})();

In your Controllers

inject your factory to your controller and then getdata

(function () {
  'use strict';

  angular
    .module('app.login')
    .controller('LoginController', LoginController);

  LoginController.$inject = ['SomeFactory'];

  function LoginController(SomeFactory) {
   var vm = this;
   vm.someVariable = SomeFactory.getData();
   console.log(vm.someVariable);  // logs your data

}
})();

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222582

Sharing data between controllers can be achieved with the following options :

Then you can inject the service across the controllers and use the data whenever you need.

app.service('myService', function($http) {
  this.getJSON = function() {
    $http.post('http://192.168.0.213:1234/api/VerifyUser', $stateParams.pageList).then(function(response) {
      return response.data;
    });
  };
});

In Controller:

app.controller('myController', function($scope, myService) {

  myService.getJSON().then(function(data) {
    $scope.myData = data;
    console.log(data);
  });

});

DEMO

Upvotes: 1

itamar
itamar

Reputation: 3967

Use Service to store the data and get the data in another controller later on.

When you inject a Service, it's the same service in every controller - so you can access the properties and methods in that service all over.

https://docs.angularjs.org/guide/services

Example:

.service('YourService', function(){
var YourService = {};
YourService.yourvar = '';
return YourService;
})

.controller('controller1', function($scope, YourService){
YourService.yourvar = 'blah';
})

.controller('controller2', function($scope, YourService){
$scope.currentYourVar = YourService.yourvar;
})

Upvotes: 0

Related Questions