Angular: Not able to access variables in controller using service

Question

I am trying to share a variable between a controller and a function. But i get an error from the controller, saying this:

TypeError: Cannot read property 'getSet' of undefined

I have gone through numerous tutorials, but don't know where am I going wrong. My service code is like this:

app.service('shareData', function() {

    var selected = ["plz", "print", "something"];

    var putSet = function(set) {
        selected = set;
    };

    var getSet = function() {
        return selected;
    };

    return {
        putSet: putSet,
        getSet: getSet
    };
});

I am able to reach selected from my function defined like this:

setDisplay = function($scope, $mdDialog, shareData) {

    console.log(shareData.getSet()); // this is working

    $scope.selected = shareData.getSet();
    $scope.hide = function() {
        $mdDialog.hide();
    };
    $scope.cancel = function() {
        $mdDialog.cancel();
    };
    $scope.answer = function(answer) {
        $mdDialog.hide(answer);
    };
};

My controller is like this:

app.controller('topicController', ['$scope', '$http', '$mdDialog', 'shareData',
function ($scope, $http, $mdDialog, $mdToast, shareData) {

    console.log(shareData.getSet()); // NOT WORKING

}]);

Pankaj Parkar · Accepted Answer · 2016-06-22 13:21:30Z

4

You had extra $mdToast in your topicController controller's factory function, you need to remove it.

The reason behind it was not working is, currently you had 4 dependency mentioned in array like ['$scope', '$http', '$mdDialog', 'shareData', function & then you are using its instance inside the function next to DI array. Inside that function you had actually 5 dependencies where $mdToast extra. So behind the scene what happening is $scope of function hold an value of '$scope' DI array likewise you go right to left. But when it comes to $mdToast(in controller function) it was holding a value of 'shareData'(of DI array) & then the next parameter shareData get nothing.

app.controller('topicController', ['$scope', '$http', '$mdDialog', 'shareData', 
      function ($scope, $http, $mdDialog, shareData) { //<--removed $mdToast
    console.log(shareData.getSet());
  }
]);

NOTE: You are using DI inline array annotation, so the sequence in which dependency are injected in array, in same sequence you should inject then in underlying factory function.

edited Jun 22, 2016 at 13:21

answered Jun 22, 2016 at 13:03

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

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

4 Comments

jAYANT YADAV Over a year ago

Thanks a lot! you saved my precious time! But i am not getting the exact reason why I was not able to access it and removing $mdToast did the magic

Pankaj Parkar Over a year ago

@jAYANTYADAV I updated my answer, with in detail explain.. I think it would help you. Thanks :)

jAYANT YADAV Over a year ago

Thanks again! Btw, what is a DI array? I mean full form.

jAYANT YADAV Over a year ago

Now it seems logical! and not magical. Thanks for clearing my concepts :)

Collectives™ on Stack Overflow

Angular: Not able to access variables in controller using service

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related