javascriptangularjsangular-translate

angular-translate display key

In my app I use the angular translate .

On my index.html I put the directive translate-cloak class="translate-cloak" with .translate-cloak {visibility: hidden;} on <body> but for the <div ui-view></div> content the key is display before my tranlsted text.

In my controller I try to do

function SearchCtrl ($translatePartialLoader, $translate) {
        $translatePartialLoader.addPart('../components/search');
        $translate.refresh();

        $translate.onReady().then(function(){
          alert($translate.instant('SEARCH_MONTH')); #display SEARCH_MONTH and not the content
          ...

How can I wait the loading of the module before to render my view ?

Thanks

Solution

  • To wait until your file gets downloaded you have to do following:

    $translatePartialLoader.addPart('../components/search');
$translate.refresh().then( /* Do your work here */ );