angular-translate display key

939 Views Asked by general03 At 16 April 2025 at 16:06

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

Original Q&A

There are 2 best solutions below

sandyJoshi On 02 January 2017 at 17:39 BEST ANSWER

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

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

Terabuck On 30 June 2020 at 19:40

Thank you, sandyJoshi! After spending a lot of time trying to figure out how to solve the issue, your solution came out. It was implemented this way:

$translatePartialLoader.addPart('file-upload-js');
$translate.refresh().then(
    // detecting a hash/anchor change using jQuery: http://www.rcneil.com/force-reload-on-a-hash-or-anchor-change-with-jquery/
    $(window).on('hashchange',function(){ 
    window.location.reload(true);
    })
);

angular-translate display key

There are 2 best solutions below

Related Questions in JAVASCRIPT

Related Questions in ANGULARJS

Related Questions in ANGULAR-TRANSLATE

Trending Questions

Popular # Hahtags

Popular Questions