Share data between controllers with a service (AngularJS)

Question

I want to build a site, which supports several languages. So I wanted to use AngularJS Controllers to controll the view. I have written some script, but I get the following error: TypeError: Cannot read property 'getLang' of undefined

Here is my AngularJS code:

var myApp = angular.module('myApp',[]);
myApp.service('languageService' , function() {
    var language = 'en';
    return {
        getLang: function() {
            return language;
        },

        setLang: function(ind) {
              if (ind == 0) {
                  language = 'en';
              } else if (ind == 1) {
                  language = 'ru';
              }
        }
    };
})

myApp.controller('ChangeLangCtrl', ['$scope', function($scope, languageService) {
     $scope.changeLang = function(ind) {
        languageService.setLang(ind);
     }
}])

myApp.controller('NaviCtrl', ['$scope', function($scope, languageService) {
    var currentLang = languageService.getLang();
    if (currentLang == 'en') {
        $scope.menu = ['About Us', 'Service', 'Contacts'];
    } else {
        $scope.menu = ['О нас', 'Наши Услуги', 'Связь с нами']
    }
}])

So what could be my mistake? I mean, I initialize the language variable with en at the beginning. So why is the getLang() function then undefined?

Make it myApp.controller('NaviCtrl', ['$scope','languageService', function($scope, languageService) { — Reena
– Reena, Commented Apr 6, 2015 at 12:35

mohamedrias · Accepted Answer · 2015-04-06 12:33:59Z

2

['$scope', function($scope, languageService)

You didm;t specify languageService

It must be

['$scope', 'languageService', function($scope, languageService)

That's the reason why you are getting languageService.getLang is undefined because you've not specified any value for languageService so getLang doesn't exit.

So your code will become:

myApp.controller('ChangeLangCtrl', [['$scope', 'languageService', 
function($scope, languageService)  {
     $scope.changeLang = function(ind) {
        languageService.setLang(ind);
     }
}])

myApp.controller('NaviCtrl', ['$scope', 'languageService', function($scope, languageService)  {
    var currentLang = languageService.getLang();
    if (currentLang == 'en') {
        $scope.menu = ['About Us', 'Service', 'Contacts'];
    } else {
        $scope.menu = ['О нас', 'Наши Услуги', 'Связь с нами']
    }
}])

answered Apr 6, 2015 at 12:33

mohamedrias

18.6k3 gold badges41 silver badges47 bronze badges

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

1 Comment

Andrej Tihonov Over a year ago

I am quit new to stackoverflow and I thought I can accept both answers. I do not have enough reputation to vote u up.

Ritt · Accepted Answer · 2015-04-06 12:47:07Z

You forget to inject languageService as a dependency in your controller,thats why its throwing that error.

Try this,

var myApp = angular.module('myApp',[]);
myApp.service('languageService' , function() {
    var language = 'en';
    return {
        getLang: function() {
            return language;
        },

        setLang: function(ind) {
              if (ind == 0) {
                  language = 'en';
              } else if (ind == 1) {
                  language = 'ru';
              }
        }
    };
})

myApp.controller('ChangeLangCtrl', ['$scope','languageService', function($scope, languageService) {
     $scope.changeLang = function(ind) {
        languageService.setLang(ind);
     }
}])

myApp.controller('NaviCtrl', ['$scope','languageService', function($scope, languageService) {
    var currentLang = languageService.getLang();
    if (currentLang == 'en') {
        $scope.menu = ['About Us', 'Service', 'Contacts'];
    } else {
        $scope.menu = ['О нас', 'Наши Услуги', 'Связь с нами']
    }
}])

Collectives™ on Stack Overflow

Share data between controllers with a service (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