AngularJS, controllers and models can't see?

I'm need to create multi language Client Side Application, can you help me with my problem.
I have files

index.html




...

the <div>{{lang.translation.GameName}}</div>
 <script type="text/javascript" src="/js/less.min.js"></script>
 <script type="text/javascript" src="/js/jquery-2.2.4.min.js"></script>
 <script type="text/javascript" src="/js/bootstrap.min.js"></script>
 <script type="text/javascript" src="/js/main.js"></script>

 


services.ang.js


app.service('TranslateSRV', '$scope', '$http', function($scope){
 $scope.translateText = function($scope, $http, language){
$http.get('../json/language.json').then(function(data){
 return data.data[language];
});
};
 });


controllers.ang.js


app.controller('Language', 'TranslateSRV', function(TranslateSRV){
 this.language = 'en';
 this.translation = {};
 this.translate = function() {
 this.translation = TranslateSRV.translateText($scope, $http,this.language);
};
this.translate();
 });


language.json


{
"ua":{
 "GameName":"the Truth ABO da",
 "ChoseLang":"Oberti MOV Gris"
},
"EN":{
 "GameName":"Truth or dare",
 "ChoseLang":"Select a language"
},
"en":{
 "GameName":"Truth or Dare",
 "ChoseLang":"Please choose game language"
}
 }


When I'm run page i see nothing, but i had some errors in my browser console.

Errors


Argument 'Language' is not a function, got string
July 9th 19 at 10:24
1 answer
July 9th 19 at 10:26
Solution

Find more questions by tags AngularJavaScript