fix(directive): Make translate-value-* work inside ng-if and ng-repeat

Closes Issue #433
angular-translate · Mar 17, 2014 · f22624b · f22624b
1 parent a3cc4be
commit f22624b
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 5 deletions.
diff --git a/src/directive/translate.js b/src/directive/translate.js
@@ -157,16 +157,21 @@ angular.module('pascalprecht.translate')
             };
           } else {
             return function () {
-              scope.$watch('interpolateParams', function (value) {
-                if (scope.translationId && value) {
-                  $translate(scope.translationId, value, translateInterpolation)
+
+              var updateTranslations = function () {
+                if (scope.translationId && scope.interpolateParams) {
+                  $translate(scope.translationId, scope.interpolateParams, translateInterpolation)
                     .then(function (translation) {
                       applyElementContent(translation, scope);
                     }, function (translationId) {
                       applyElementContent(translationId, scope);
                     });
-                }
-              }, true);
+                  }
+              };
+
+              // watch both interpolateParams and translationId, because watchers are triggered non-deterministic
+              scope.$watch('interpolateParams', updateTranslations, true);
+              scope.$watch('translationId', updateTranslations);
             };
           }
         }());

diff --git a/test/unit/directive/translate.spec.js b/test/unit/directive/translate.spec.js
@@ -329,6 +329,21 @@ describe('pascalprecht.translate', function () {
       $rootScope.$digest();
       expect(element.text()).toEqual('hello my name is Glenn Jorde.');
     });
+
+    // addresses [issue #433](https://github.com/angular-translate/angular-translate/issues/433)
+    it('should interpolate variables inside ng-if directives', function () {
+      var markup = '<div ng-if="true"><p translate="FOO" translate-value-name="{{name}}"></p></div>';
+      element = $compile(markup)($rootScope);
+      $rootScope.$digest();
+      expect(element.next().text()).toEqual('hello my name is Pascal');
+    });
+
+    iit('should interpolate variables inside ng-repeat directives', function () {
+      var markup = '<div><div ng-repeat="i in [1]"><p translate="FOO" translate-value-name="{{name}}"></p></div></div>';
+      element = $compile(markup)($rootScope);
+      $rootScope.$digest();
+      expect(element.children().text()).toEqual('hello my name is Pascal');
+    });
   });
 
   describe('translate sanitization', function () {