fix(service): make initial translation streaming lazy (#960)

Fixes #815

projects/ngx-translate/core/src/lib/translate.service.ts

@@ -1,5 +1,5 @@
 import {EventEmitter, Inject, Injectable, InjectionToken} from "@angular/core";
-import {concat, forkJoin, isObservable, Observable, of} from "rxjs";
+import {concat, forkJoin, isObservable, Observable, of, defer} from "rxjs";
 import {concatMap, map, shareReplay, switchMap, take} from "rxjs/operators";
 import {MissingTranslationHandler, MissingTranslationHandlerParams} from "./missing-translation-handler";
 import {TranslateCompiler} from "./translate.compiler";
@@ -388,7 +388,7 @@ export class TranslateService {
     }
 
     return concat(
-      this.get(key, interpolateParams),
+      defer(() => this.get(key, interpolateParams)),
       this.onTranslationChange.pipe(
         switchMap((event: TranslationChangeEvent) => {
           const res = this.getParsedResult(event.translations, key, interpolateParams);
@@ -413,7 +413,7 @@ export class TranslateService {
     }
 
     return concat(
-      this.get(key, interpolateParams),
+      defer(() => this.get(key, interpolateParams)),
       this.onLangChange.pipe(
         switchMap((event: LangChangeEvent) => {
           const res = this.getParsedResult(event.translations, key, interpolateParams);

projects/ngx-translate/core/tests/translate.service.spec.ts

@@ -1,6 +1,6 @@
 import {fakeAsync, TestBed, tick} from "@angular/core/testing";
 import {Observable, of, timer, zip, defer} from "rxjs";
-import {mapTo, take, toArray} from 'rxjs/operators';
+import {mapTo, take, toArray, first} from 'rxjs/operators';
 import {LangChangeEvent, TranslateLoader, TranslateModule, TranslateService, TranslationChangeEvent} from '../src/public_api';
 
 let translations: any = {"TEST": "This is a test"};
@@ -299,6 +299,37 @@ describe('TranslateService', () => {
     translate.use('en');
   });
 
+  it('should update lazy streaming translations on translation change', (done: Function) => {
+    translations = {"TEST": "This is a test"};
+    translate.use('en');
+
+    const translation$ = translate.getStreamOnTranslationChange('TEST');
+
+    translate.setTranslation('en', {"TEST": "This is a test2"});
+
+    translation$.pipe(first()).subscribe((res: string[]) => {
+      const expected = "This is a test2";
+      expect(res).toEqual(expected);
+      done();
+    });
+  });
+
+  it('should update lazy streaming translations on language change', (done: Function) => {
+    translations = {"TEST": "This is a test"};
+    translate.use('en');
+
+    const translation$ = translate.stream('TEST');
+
+    translate.setTranslation('nl', {"TEST": "Dit is een test"});
+    translate.use('nl');
+
+    translation$.pipe(first()).subscribe((res: string[]) => {
+      const expected = 'Dit is een test';
+      expect(res).toEqual(expected);
+      done();
+    });
+  });
+
   it('should update streaming translations of an array on language change', (done: Function) => {
     const en = {"TEST": "This is a test", "TEST2": "This is a test2"};
     const nl = {"TEST": "Dit is een test", "TEST2": "Dit is een test2"};