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

angular-translate, angularjs, angularjs-filter, javascript

Solution

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>

Problem

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?

Original source