1

in my app I would like to add functionality to translate page into all languages that user has set in browser and if none of them is available translate into default english... Problem is browser inconsistency with language support. I found a workaround for this, I make a http call to some webservice which returns user languages. It is done in app.run 

app.run(function($rootScope, UserDataService, $translate){ UserDataService.getUserBrowserLanguage().then(function(language){ var langArr = language.split(',').map(function(el){ return el.split(';')[0].split(/-|_/)[0]; }); $translate.fallbackLanguage(langArr) $translate.preferredLanguage(langArr[0]); $translate.use(langArr[0]); });

});

and in app config:

app.config(function ($routeProvider, $translateProvider) { $translateProvider.useStaticFilesLoader({ prefix: '/languages/', suffix: '.json' }); });

section because I can't make http call in config and it fails... :/ langauges are loaded but the translation isn't changed... What am I doing wrong? Here is plunker:

http://plnkr.co/edit/41SngK2tCTeaq8IhMbcM

it doesn't display anything no translations... why? :( I would be very pleased with any help.

Improve this question
4
  • Hi Adi86, In my answer you will find 2 parts: Part 1: corrected your angular issues Part 2: corrected your translate issues. Enjoy! Commented Feb 18, 2015 at 16:35
  • Sorry Or Guz but it doesn't solve the problem still when you load the translation is in wrong language moreover adding steTimeout isn't a good idea :) Commented Feb 19, 2015 at 8:57
  • There is another option, you can add a $watch for translate instant. Commented Feb 19, 2015 at 13:16
  • In addition, It is not the wrong language, it is the language you configured it to use. Commented Feb 19, 2015 at 13:40

1 Answer 1

Reset to default
1

As for your question the view doesn't show anything due to the following errors:

Few mistakes: First of all, ng-app should be moved to the html tag.

<html ng-app="translateApp">

Second, if you use a variable from a controller you should use ng-controller.

<div ng-controller="mainCtrl">

Last, when you bind a variable from the view to the controller the variable should be on the $scope.

 $scope.translation = $translate.instant('GENERAL');

Fixed your plunker with my comments: Plunker.

As for the way $translate works, I am not really familiar with this service but I will try and have a look.

EDIT: I studied $translate service in order to give you a full answer including fixing the way you used Translate, So first of all I put a timeout of 2 seconds before trying to use translate.instant, the reason is that I am letting translate loading the JSON files in the config.

I have added 2 buttons so you could switch between the languages and see it is working.

Enjoy! Here is the updated working Plunker. Here is translate documentation site I used.

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

6 Comments

Yes it works but not as expected... It translates to english but should first to chinese assuming that you have selected eg. Africanese, Chinese, Endlish...
Regarding the way you configured your translation service, I will try and have a look asap. My answer was for your question, to fix all your errors so you will be able to use the translation service correctly.
Heheh no no problem is still open :) now it only works but not as expected to be...
Hmmm I see that you did changes but hmmm it still dosn't work... :( when you load page the filter translate still replaces text in english... but it should be in chinese... :/
Why do you say it is supposed to be in Chinese? I don't see a reason why it should be immediately in Chinese
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.