CODEWITHSUNDEEP
javaangularjsinternationalizationtranslate
develop
develop

Reputation: 141

How to use tooltip with translate tag ? AngularJS

I have a button and button script code :

<a ng-hide="custom" href="#" tooltip-placement="bottom" tooltip="Zoom in" onclick="ga('send','event','Navigation Tool','Navigation Tool','Zoom in')" class="onezoomin" ng-click="navSelected('onezoomin');">
    <img src="assets/images/1428276334_expand.png" class="navImageStyle">
</a>

and I want to translate tag for this code. How can I do ?

for example : 

<a ng-hide="custom" href="#" tooltip-placement="bottom" tooltip="translate='navMenu.hide.zoomin'" onclick="ga('send','event','Navigation Tool','Navigation Tool','Zoom in')" class="onezoomin" ng-click="navSelected('onezoomin');">
    <img src="assets/images/1428276334_expand.png" class="navImageStyle">
</a>

but Didnt work.

navMenu is json file.

so navMenu.json code :

    {
         "navMenu":{
         "hide": "Hide",
         "hide": {
             "zoomin": "Zoom In"
         }
     }
}

Upvotes: 1

Views: 6201

Answers (1)

Michel
Michel

Reputation: 28339

Use the translate filter for that, not the directive:

tooltip="{{'navMenu.hide.zoomin' | translate}}"

And if your version of angular is above 1.3, you can use the following syntax for performance matter:

tooltip="{{::'navMenu.hide.zoomin' | translate}}"

The syntax above will prevent keeping watchers in memory.

Upvotes: 4

Related Questions