Sharing a global variable between 2 controllers FAILED after a GET request in AngularJS

Question

I'm using 2 different controllers sharing a global value currentOpenningFolder. I want that 2 controllers can both sync to that variable no matter what. But in this example, in the GET request I change the variable in the first controller but I can't view that variable in the second controller. Instead it shows the initial value of currentOpenningFolder. Any ideas why this may be happening?

      angular.module('scopeExample', [])   
.controller('MyController', ['$scope','currentOpenningFolder','$http', function($scope,currentOpenningFolder,$http) {
            $scope.sayHello = function() {

          $http.get('https://api.github.com/users/chuson1996').then(function(obj){
            currentOpenningFolder = obj;
            console.log(currentOpenningFolder);
          })
        };
      }])
      .controller('MyController2', ['$scope','currentOpenningFolder', function($scope,currentOpenningFolder) {
        $scope.sayHello = function() {
          $scope.currentOpenningFolder = currentOpenningFolder;
          console.log($scope.currentOpenningFolder);
        };
      }])
      .value('currentOpenningFolder',{});

Mukund Kumar · Accepted Answer · 2015-05-04 18:45:11Z

1

Don't assign an object to other object like this:

currentOpenningFolder = obj;

if you assign as this,currentOpenningFolder will loose reference to original object and refer to other object obj. so best way to do this is to create a property of currentOpenningFolder and assign object to that prperty like this :

currentOpenningFolder.prop = obj;

and then access this to other controller like:

$scope.currentOpenningFolder = currentOpenningFolder.prop;

Edited:

Try this plunkr

edited May 4, 2015 at 18:45

answered May 4, 2015 at 18:03

Mukund Kumar

23.5k20 gold badges64 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mukund Kumar Over a year ago

could you please create plunkr or fiddle ?

charlietfl · Accepted Answer · 2015-05-04 18:27:46Z

0

A very simple fix is to extend the existing object instead of replacing it. Replacing it is causing references to be broken

Change

currentOpenningFolder = obj;

To

angular.extend(currentOpenningFolder , obj);

This leaves the existing object intact ( and the other references) and merges changes into it.

Also in the controllers I'm not sure why you set the scope variable that points to currentOpenningFolder within a function. You likely want to declare it outside the function

Without seeing more code it seems like $scope.sayHello=function(... should be replaced with $scope.currentOpenningFolder = currentOpenningFolder;

edited May 4, 2015 at 18:27

answered May 4, 2015 at 18:22

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Collectives™ on Stack Overflow

Sharing a global variable between 2 controllers FAILED after a GET request in AngularJS

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related