Transfer some data from one controller to another, or how to change controller to service

Question

How can i take information from one controller to another, or how can i make service from a controller? I need to take coordinates and save it to object with some other variables, if i put dependencie one controllers into another it doesnt work. Most of information in controller below are irrelevant, i just need lat and long, and save it in other controller.

.controller('MapCtrl', function($scope, $cordovaGeolocation, $ionicLoading, $ionicPlatform, $cordovaScreenshot, $ionicPopup) {

$ionicPlatform.ready(function() {

    $ionicLoading.show({
        template: '<ion-spinner icon="bubbles"></ion-spinner><br/>Acquiring location!'
    });

    var posOptions = {
        enableHighAccuracy: true,
        timeout: 20000,
        maximumAge: 0
    };
    $cordovaGeolocation.getCurrentPosition(posOptions).then(function (position) {
        var lat  = position.coords.latitude;
        var long = position.coords.longitude;
        $scope.duzina = long;
        $scope.sirina = lat;
        console.log("Širina: " + lat + '\n' + "Dužina: " +  long);
        var myLatlng = new google.maps.LatLng(lat, long);

        var mapOptions = {
            center: myLatlng,
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };          

        var map = new google.maps.Map(document.getElementById("map"), mapOptions);          

        $scope.map = map;   
        $ionicLoading.hide();   

        var marker = new google.maps.Marker({
        animation: google.maps.Animation.DROP,
        draggable: true,
        label: 'A',
        position: myLatlng,


        map: map,
        title: 'Trenutna Lokacija'


    });
    var labels = 'BCDEFGHIJKLMNOPQRSTUVWXYZ';
    var labelIndex = 0;
    google.maps.event.addListener(map, 'click', function(event) {
    addMarker(event.latLng, map);

    });

    function addMarker(location, map) {

    var marker = new google.maps.Marker({
    position: location,
    label: labels[labelIndex++ % labels.length],
    map: map
    });   
    }       

    }, function(err) {
        $ionicLoading.hide();
        console.log(err);
    });
})

})

What are relations between cotnrollers? If they are not nested to each other, then you need some temporary storage, like localstorage, or save via API to your backend and then retrieve via API call (but saving to localstorage is better). — naneri, Mar 15 '16 at 09:12
interesting, i tried with localStorage but its not working, i will do it with service — Mark, Mar 15 '16 at 10:13

score 0 · Accepted Answer · answered Mar 15 '16 at 09:20

You can make a factory that will work as a global object

myApp.factory('Data', function () {
    return { FirstName: '' };
});

myApp.controller('FirstCtrl', function ($scope, Data) {
    $scope.Data = Data;
});

myApp.controller('SecondCtrl', function ($scope, Data) {
    $scope.Data = Data;
});

Or use a service , with geter an seter

//services 
app.service('Shared',function(){
 var data={value :0};
 return{
  getData: function(){
   return data.value;
  },
  setData: function(value){
   data.value = value;
  }
 };
});

score 0 · Answer 2 · edited May 23 '17 at 12:07

You have to use something which is called a service or factory. They are quite simmilar. (To see learn the differences: AngularJS : When to use service instead of factory) You can call functions and store data to be used all over the application. The basic setup for a service will be:

var app = angular.module('moduleName');
app.service('serviceName', [function(){
   //Your code here
   //i.e.
   var storedValue;
   function setValue(value){
      storedValue = value;
   }
   function getValue(){
      return storedValue;
   }
}]);

And the controller that uses the service will have to inject the service.

var app = angular.module('moduleName');

app.controller('testCtrl', ['$scope', 'serviceName', function($scope, serviceName){
   //Do something with the stored value
   $scope.someVariable = serviceName.getValue();

   //Set global variable
   serviceName.setValue(someVariable);
}

Transfer some data from one controller to another, or how to change controller to service

2 Answers2