fix(directive): fix for translations starting or ending with whitespaces

Fixes #790

Author: CodeAndWeb

lib/src/translate.directive.ts

@@ -75,11 +75,12 @@ export class TranslateDirective implements AfterViewChecked, OnDestroy {
             node.lastKey = null;
           }
         } else {
-          let content = this.getContent(node).trim();
-          if (content.length) {
+          let content = this.getContent(node);
+          let trimmedContent = content.trim();
+          if (trimmedContent.length) {
             // we want to use the content as a key, not the translation value
             if (content !== node.currentValue) {
-              key = content;
+              key = trimmedContent;
               // the content was changed from the user, we'll use it as a reference if needed
               node.originalContent = this.getContent(node);
             } else if (node.originalContent && forceUpdate) { // the content seems ok, but the lang has changed

tests/translate.directive.spec.ts

@@ -137,6 +137,28 @@ describe('TranslateDirective', () => {
     expect(fixture.componentInstance.noContent.nativeElement.innerHTML).toEqual("C'est un test");
   });
 
+  it('should update the DOM when the lang changes and the translation ends with space', () => {
+    expect(fixture.componentInstance.noKey.nativeElement.innerHTML).toEqual('TEST');
+    expect(fixture.componentInstance.withParams.nativeElement.innerHTML).toEqual('TEST');
+    expect(fixture.componentInstance.noContent.nativeElement.innerHTML).toEqual('TEST');
+
+    const en="  This is a test - with spaces ";
+    const fr="  C'est un test - pardon, je ne parle pas francais :) ";
+
+    translate.setTranslation('en', {"TEST": en});
+    translate.setTranslation('fr', {"TEST": fr});
+
+    translate.use('en');
+    expect(fixture.componentInstance.noKey.nativeElement.innerHTML).toEqual(en);
+    expect(fixture.componentInstance.withParams.nativeElement.innerHTML).toEqual(en);
+    expect(fixture.componentInstance.noContent.nativeElement.innerHTML).toEqual(en);
+
+    translate.use('fr');
+    expect(fixture.componentInstance.noKey.nativeElement.innerHTML).toEqual(fr);
+    expect(fixture.componentInstance.withParams.nativeElement.innerHTML).toEqual(fr);
+    expect(fixture.componentInstance.noContent.nativeElement.innerHTML).toEqual(fr);
+  });
+
   it('should update the DOM when the default lang changes', () => {
     expect(fixture.componentInstance.noKey.nativeElement.innerHTML).toEqual('TEST');