angular - 通过可观察的服务设置LOCALE_ID

Question

我有一项提供全局应用程序语言的服务，如下所示:

export class LanguageService {
  private currentLanguage$ = new ReplaySubject < string > ();

  getCurrentLanguage(): Observable < string > {
    return this.currentLanguage$.asObservable();
  }
}

我使用这项服务在整个应用程序中即时提供语言切换。所有组件都遵循上述功能提供的语言(“en”，“fr”等)，我也希望 CurrencyPipe也这样做。

据我了解，我可以通过 LOCALE_ID提供此功能，但是我无法在文档中找到有关如何执行此操作的示例或指南，尤其是找不到如何使用可观察到的示例或指南。

Answer 1

Angular的解决方案是使用i18n创建多个版本。当然，由于某些原因，这可能是不可能的。

我在datepipe上几乎遇到了同样的问题，唯一的区别是我在使用局部变量。

首先，我试图在我的appModule中提供它:

{
  provide: LOCALE_ID, deps: [WindowRef], useFactory(windowRef: WindowRef) {
    return windowRef.ln;
  }
}

服务:

@Injectable()
export class WindowRef {
  get nativeWindow(): any {
    return _window();
  }

  public ln = 'en';


  constructor() {
    try {
      if (!isNullOrUndefined(this.nativeWindow.navigator.language) && this.nativeWindow.navigator.language !== '') {
        this.ln = this.nativeWindow.navigator.language;
      }
    }finally {}
  }
}

但这在使用AOT时对我不起作用。我的解决方案是创建自己的日期管道，以扩展有角度的日期管道。

结果是:

@Pipe({name: 'datepipe', pure: true})
export class MyDatePipe extends DatePipe implements PipeTransform {
  constructor(private win: WindowRef) {
    super(win.ln);
  }

  transform(value: any, pattern?: string): string | null {
    return super.transform(value, pattern);
  }
}

您可以执行几乎相同的操作，但是可以扩展currencyPipe。