Sharing Data All Versions
This draft deletes the entire topic.
Examples
-
Firstly, include the ngStorage source in your index.html.
An example injecting
ngStoragesrc would be:<head> <title>Angular JS ngStorage</title> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <script src="https://rawgithub.com/gsklee/ngStorage/master/ngStorage.js"></script> </head>ngStoragegives you 2 storage namely:$localStorageand$sessionStorage. You need to require ngStorage and Inject the services.Suppose if
ng-app="myApp", then you would be injectingngStorageas following:var app = angular.module('myApp', ['ngStorage']); app.controller('controllerOne', function($localStorage,$sessionStorage) { // an object to share var sampleObject = { name: 'angularjs', value: 1 }; $localStorage.valueToShare = sampleObject; $sessionStorage.valueToShare = sampleObject; }) .controller('controllerTwo', function($localStorage,$sessionStorage) { console.log('localStorage: '+ $localStorage +'sessionStorage: '+$sessionStorage); })$localStorageand$sessionStorageis globally accessible through any controllers as long as you inject those services in the controllers.You can also use the
localStorageandsessionStorageofHTML5. However, usingHTML5localStoragewould require you to serialize and deserialize your objects before using or saving them.For example:
var myObj = { firstname: "Nic", lastname: "Raboy", website: "https://www.google.com" } //if you wanted to save into localStorage, serialize it window.localStorage.set("saved", JSON.stringify(myObj)); //unserialize to get object var myObj = JSON.parse(window.localStorage.get("saved")); -
We can create a
servicetosetandgetthe data between thecontrollersand then inject that service in the controller function where we want to use it.Service :
app.service('setGetData', function() { var data = ''; getData: function() { return data; }, setData: function(requestData) { data = requestData; } });Controllers :
app.controller('myCtrl1', ['setGetData',function(setGetData) { // To set the data from the one controller var data = 'Hello World !!'; setGetData.setData(data); }]); app.controller('myCtrl2', ['setGetData',function(setGetData) { // To get the data from the another controller var res = setGetData.getData(); console.log(res); // Hello World !! }]);Here, we can see that
myCtrl1is used forsettingthe data andmyCtrl2is used forgettingthe data. So, we can share the data from one controller to another contrller like this. -
Remarks
A very common question when working with Angular is how to share data between controllers. Using a service is the most frequent response and this is a simple example demonstrating a factory pattern to share any type of data object between two or more controllers. Because it is a shared object reference, an update in one controller will be immediately available in all other controllers using the service. Note that both service and factory and both providers.
Sign up or log in
Save edit as a guest
Join Stack Overflow
We recognize you from another Stack Exchange Network site!
Join and Save Draft