1

I'm using angular-translation and angular-foundation modules with AngularJS and have defined Foundation top-bar like this:

<top-bar custom-back-text="true" back-text="My back text">

[...]

</top-bar>

I need to apply translate filter to My back text. Already tried these two solutions but with no success:

example 1 - CODE

<top-bar custom-back-text="true" back-text="'BACK.KEY' | translate">

example 1 - TEXT IN MENU

BACK.KEY

example 2 - CODE

<top-bar custom-back-text="true" back-text="{{ 'BACK.KEY' | translate }}">

example 2 - TEXT IN MENU 

'BACK.KEY' | translate

Do I something wrong or is there no possibility to achieve this with these two modules?

Used versions

angular-translate: 2.4.2
angular-foundation: 0.5.1
Knut Holm
  • 3,988
  • 4
  • 32
  • 54

1 Answers1

0

If you check the js source code of foundation you will find this piece of code that handles back button

if (settings.custom_back_text == true) {
    $('h5>a', $titleLi).html(settings.back_text);
} else {
    $('h5>a', $titleLi).html('&laquo; ' + $link.html());
}
$dropdown.prepend($titleLi);

So it creates new element and adds to dropdown, result of which is that it copies the value you specified in the back_text. By that time "translate" is not resolved so it copies whatever you put there.

A quick hack to do to solve it you could listen for language change by doing

$rootScope.$on("$translateChangeSuccess", function...

As you can see in the piece of code from foundation.js it creates "a" element inside "h5", so you can do something like this

$rootScope.$on("$translateChangeSuccess", function(){
  angular.element(".dropdown h5>a").html($filter('translate')('BACK'))
})

where "BACK" is the key used for translation.

But keep in mind that it's not a good practice to manipulate DOM inside controller, so you may create directive for that.

Though there may be better way to achieve it, this could be just quick hack to do the thing.

Edgar Zakaryan
  • 576
  • 5
  • 11
  • Thanks for your response but I haven't tried your solution. I don't want a "hacky" solution and no one else exist probably so I've replaced the back text with a multilingual back arrow. Not ideal but sufficient. – Knut Holm Jan 05 '15 at 11:17
  • I've used your trick finally to fix another problem with translation so I'm accepting this answer. – Knut Holm Jan 19 '15 at 11:20