diff --git a/libs/transloco-locale/src/lib/transloco-locale.service.ts b/libs/transloco-locale/src/lib/transloco-locale.service.ts index c19206a0..99420386 100644 --- a/libs/transloco-locale/src/lib/transloco-locale.service.ts +++ b/libs/transloco-locale/src/lib/transloco-locale.service.ts @@ -1,6 +1,6 @@ -import { inject, Injectable, OnDestroy } from '@angular/core'; +import { DestroyRef, inject, Injectable } from '@angular/core'; import { TranslocoService } from '@jsverse/transloco'; -import { BehaviorSubject, Subscription } from 'rxjs'; +import { BehaviorSubject } from 'rxjs'; import { distinctUntilChanged, filter, map } from 'rxjs/operators'; import { isLocaleFormat, toDate } from './helpers'; @@ -27,7 +27,7 @@ import { @Injectable({ providedIn: 'root', }) -export class TranslocoLocaleService implements OnDestroy { +export class TranslocoLocaleService { private translocoService = inject(TranslocoService); private langLocaleMapping = inject(TRANSLOCO_LOCALE_LANG_MAPPING); private defaultLocale = inject(TRANSLOCO_LOCALE_DEFAULT_LOCALE); @@ -39,16 +39,26 @@ export class TranslocoLocaleService implements OnDestroy { private _locale = this.defaultLocale || this.toLocale(this.translocoService.getActiveLang()); - private locale: BehaviorSubject = new BehaviorSubject(this._locale); - private subscription: Subscription | null = this.translocoService.langChanges$ - .pipe( - map((lang) => this.toLocale(lang)), - filter(Boolean), - ) - .subscribe((locale: Locale) => this.setLocale(locale)); + private locale = new BehaviorSubject(this._locale); localeChanges$ = this.locale.asObservable().pipe(distinctUntilChanged()); + constructor() { + inject(DestroyRef).onDestroy(() => { + // Complete subjects to release observers if users forget to unsubscribe manually. + // This is important in server-side rendering. + this.locale.complete(); + }); + + this.translocoService.langChanges$ + .pipe( + map((lang) => this.toLocale(lang)), + filter(Boolean), + ) + // Note: No need to unsubscribe because `lang` is completed by the `TranslocoService`. + .subscribe((locale: Locale) => this.setLocale(locale)); + } + getLocale() { return this._locale; } @@ -143,13 +153,6 @@ export class TranslocoLocaleService implements OnDestroy { return this.localeCurrencyMapping[locale] || this.defaultCurrency; } - ngOnDestroy() { - this.subscription?.unsubscribe(); - // Caretaker note: it's important to clean up references to subscriptions since they save the `next` - // callback within its `destination` property, preventing classes from being GC'd. - this.subscription = null; - } - private toLocale(val: string | Locale): Locale { if (this.langLocaleMapping[val]) { return this.langLocaleMapping[val];