I'm trying to write a translation service based off of this post, but I'm not able to start debugging because I keep getting the error "Error: [ng:areq] Argument 'TranslationController' is not a function, got undefined".

I've copied the structure from my other controllers that work just fine, where am I going wrong?

(Partial app.js code)

}).when('/Location', {
        templateUrl: "Views/Location/Location.html",
        controller: "TranslationController"

Partial index.html code - ignore the malformed html

script type="text/javascript" src="js/TranslationService.js"></script
script type="text/javascript" src="js/TranslationController.js"></script
script type="text/javascript" src="js/angular/i18n/angular-locale_en.js"></script

TranslationController.js

angular
    .module('app')
    .controller('TranslationController', ['$scope', '$cookies', 'TranslationService', function($scope, $cookies, $TranslationService) {
        $scope.translation;

        var onSuccess = function (tx, r) {
            $scope.$apply(function () {
                $scope.translation = r;
        });

        $scope.init = function () {
            $TranslationService.getTranslation(onSuccess, $scope, $cookies.lang);
        }

        $scope.init();
}]);

TranslationService.js

angular
    .module('TDE')
    .factory('TranslationService', ['$resource', function($resource) {
        return {
            Translations : function(fn) {
                return getTranslation($resource, $scope, $cookies.lang);
            }
        };

        this.getTranslation = function($resource, $scope, language) {
            var languageFilePath = "js/translations/translation_" + language + ".json";
            window.logger.logIt("language path = " + languageFilePath);
            $resource(languageFilePath).get(function (data) {
                $scope.translation = data;
            })
        }
}]);

Partial location.html file:

<label>{{translation._EXPERIMENTTITLE_}}</label>
有帮助吗?

解决方案

After examining your code it seems that you forgot to add '}' after onSuccess method

angular
    .module('app')
    .controller('TranslationController', ['$scope', '$cookies', 'TranslationService', function($scope, $cookies, $TranslationService) {
        $scope.translation;

        var onSuccess = function (tx, r) {
            $scope.$apply(function () {
                $scope.translation = r;
        }); 

     }// forgot to add this

        $scope.init = function () {
            $TranslationService.getTranslation(onSuccess, $scope, $cookies.lang);
        }

        $scope.init();
}]);
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top