feat(translateDirective): teaches directives to use custom interpolation

angular-translate · Jul 18, 2013 · bf3dbbb · bf3dbbb
1 parent 46f03cc
commit bf3dbbb
Show file tree

Hide file tree

Showing 2 changed files with 60 additions and 2 deletions.
diff --git a/src/directive/translate.js b/src/directive/translate.js
@@ -84,6 +84,9 @@ angular.module('pascalprecht.translate')
     scope: true,
     link: function linkFn(scope, element, attr) {
 
+      if (attr.translateInterpolation) {
+        scope.interpolation = attr.translateInterpolation;
+      }
       // Ensures any change of the attribute "translate" containing the id will
       // be re-stored to the scope's "translationId".
       // If the attribute has no content, the element's text value (white spaces trimmed off) will be used.
@@ -102,14 +105,14 @@ angular.module('pascalprecht.translate')
       // Ensures the text will be refreshed after the current language was changed
       // w/ $translate.uses(...)
       scope.$on('translationChangeSuccess', function () {
-        element.html(translate(scope.translationId, scope.interpolateParams));
+        element.html(translate(scope.translationId, scope.interpolateParams, scope.interpolation));
       });
 
       // Ensures the text will be refreshed after either the scope's translationId
       // or the interpolated params have been changed.
       scope.$watch('translationId + interpolateParams', function (nValue) {
         if (nValue) {
-          element.html(translate(scope.translationId, scope.interpolateParams));
+          element.html(translate(scope.translationId, scope.interpolateParams, scope.interpolation));
         }
       });
     }

diff --git a/test/unit/translateDirectiveSpec.js b/test/unit/translateDirectiveSpec.js
@@ -342,4 +342,59 @@ describe('pascalprecht.translate', function () {
     });
 
   });
+
+  describe('translate-interpolation attribute', function () {
+
+    var $rootScope, $compile;
+
+    beforeEach(module('pascalprecht.translate', function ($translateProvider, $provide) {
+
+      $provide.factory('customInterpolation', function () {
+
+        var translateInterpolator = {},
+            $locale;
+
+        // provide a method to set locale
+        translateInterpolator.setLocale = function (locale) {
+          $locale = locale;
+        };
+
+        // provide a method to return an interpolation identifier
+        translateInterpolator.getInterpolationIdentifier = function () {
+          return 'custom';
+        }
+
+        // defining the actual interpolate function
+        translateInterpolator.interpolate = function (string, interpolateParams) {
+          return 'custom interpolation';
+        };
+
+        return translateInterpolator;
+      });
+
+      $translateProvider.translations('en', {
+        'FOO': 'Yesssss'
+      });
+
+      $translateProvider.addInterpolation('customInterpolation');
+      $translateProvider.preferredLanguage('en');
+    }));
+
+    beforeEach(inject(function (_$rootScope_, _$compile_) {
+      $rootScope = _$rootScope_;
+      $compile = _$compile_;
+    }));
+
+    it('should consider translate-interpolation value', function () {
+      // we can use normal interpolation
+      element = $compile('<p translate="FOO"></p>')($rootScope);
+      $rootScope.$digest();
+      expect(element.text()).toEqual('Yesssss');
+
+      // and we can override it
+      element = $compile('<p translate="FOO" translate-interpolation="custom"></p>')($rootScope);;
+      $rootScope.$digest();
+      expect(element.text()).toEqual('custom interpolation');
+    });
+  });
 });