How to access $scope from one controller to another in angular

Question

I have these controller codes from different js files.

NLGoalsCtrl.js

angular.module('mysite').controller('NLGoalsCtrl', function ($scope) {
    $scope.goals_selected = [];
});

NLSessionsCtrl.js

angular.module('mysite').controller('NLSessionsCtrl', function ($scope) {
    //access $scope.goals_selected here
});

I need to be able to access the $scope.goals_selected from the NLSessionsCtrl. How do I do this? Thanks guys.

you could have angular service which will responsible for sharing data amongst you controller — Pankaj Parkar
– Pankaj Parkar, Commented Jan 7, 2016 at 14:43
You'll probably want to use an angular service to share that data, as scopes are local to a controller. — CollinD
– CollinD, Commented Jan 7, 2016 at 14:43
You're going to want to use a service to share this code across controllers. docs.angularjs.org/guide/services — developthewebz
– developthewebz, Commented Jan 7, 2016 at 14:43

Satpal · Accepted Answer · 2016-01-07 14:44:49Z

3

Use a factory/service to store the goals which will be responsible for sharing data among the controllers.

myApp.factory('myService', [function() {
        var goals = {};
        return {
            getGoals: function() {
                return goals
            },

            setGoals: function(op) {
                goals = op;
            },
        }
    }])
    .controller('NLGoalsCtrl', [function($scope, myService) {
        $scope.goals_selected  = {};
        //Update goals_selected
        myService.setGoals($scope.goals_selected );
    }])
    .controller('NLSessionsCtrl', [function($scope, myService) {
        //Fetch
        $scope.goals_selected  = myService.getGoals();
    }]);

answered Jan 7, 2016 at 14:44

Satpal

134k13 gold badges168 silver badges171 bronze badges

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

2 Comments

Yogesh Over a year ago

will this really work? I mean what if goal_selected is modified from view after execution of myService.setGoals($scope.goals_selected)? In this case myService.getGoals() will give me updated values or a stale copy of data?

devqon Over a year ago

You should use a pointer to the variable, not a function. That way you will always keep it in sync, meaning that angular registers changes and because the pointers are the same, it will also update in the other controller. OR you will need to set watchers in your controllers, which will evaluate the factory functions

Sajeetharan · Accepted Answer · 2016-01-07 14:43:56Z

1

$scope is an "object" that "binds" to DOM element where you apply controller. So the context of $scope remains inside the controller.

If you want to access the variables in 2 controllers , try to share it via a service/Factory or $rootScope

Here is a sample App

answered Jan 7, 2016 at 14:43

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Comments

AsimRazaKhan · Accepted Answer · 2016-01-07 14:50:49Z

0

the one that you want to access in any controller assign it to the $rootScope. and access it in any controller you want.

answered Jan 7, 2016 at 14:50

AsimRazaKhan

2,2323 gold badges25 silver badges36 bronze badges

Collectives™ on Stack Overflow

How to access $scope from one controller to another in angular

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related