Using AngularJS and Angular Translate how do you check if a string has been translated?

Question

How do you check if a string has a translated value? I'm using AngularJS and AngularTranslate.

I only want to display a value if it has a been translated. Angular Translate will show the untranslated string if no translation is available.

I started off doing this:

<div ng-if="question.text | translate != question.text">{{ question.text | translate }}</div>

But this doesn't work as the comparison happens before the translate filter has done it's work. (At least I think that is what happens).

What I ended up doing is:

  .filter('isTranslated', function(){
return function(translatedVal, originalVal){
  return (translatedVal === originalVal) ? false : true;
}

})

<div ng-if="question.text | translate | isTranslated:question.text">{{ question.text | translate }}</div>

This works fine but I am wondering if there is a better way of doing this?

Pieter Herroelen · Answer 1 · 2016-04-19T12:50:46.650

7

Angular-translate also provides a service, so you could build your own filter around it:

.filter('myTranslate', function($translate){
   return function(key){
      var translation = $translate(key);
      if(translation==key) {
         return "";
      } else {
         return translation;
   }  
}

This will make your HTML much cleaner:

<div>{{ question.text | myTranslate }}</div>

edited Apr 19 '16 at 12:50

answered Dec 06 '13 at 14:24

Pieter Herroelen

5,977
2
29
37

Your link is broken. – delkant Apr 18 '16 at 13:49
@delkant fixed the link – Pieter Herroelen Apr 19 '16 at 12:51
What if your translation and your key are actually the same? – SebSob Jan 15 '18 at 10:34
@SebSob please have a look at my new answer – Pieter Herroelen Jan 16 '18 at 15:36

score 0 · Answer 2 · answered Jan 16 '18 at 15:35

0

Since some time now you can use a custom error handler https://angular-translate.github.io/docs/#/guide/17_custom-error-handler to return an empty string if no translation is found.

answered Jan 16 '18 at 15:35

Pieter Herroelen

5,977
2
29
37

score 0 · Answer 3 · answered Jan 09 '19 at 11:07

0

*ngIf="!(question.text | translate)"

answered Jan 09 '19 at 11:07

BaronBaleron

151
1
2

Using AngularJS and Angular Translate how do you check if a string has been translated?

3 Answers3