如何在 Angular 2 应用程序中使 DateAdapter 单例？

我正在开发一个带有延迟加载模块的 Angular 7 应用程序。我也使用有角度的材料组件。我想在日期选择器组件中本地化并支持多个区域设置。

当应用程序语言发生变化时，我想在整个应用程序中全局更改它。可以通过 DateAdapter.setLocale 方法完成。 然而问题是，如果我在根模块上更改它，那么它在延迟加载的模块中不会更改。

是的，延迟加载的模块有其注入器并接收其 DateAdapter，其中区域设置未设置为正确的区域。

如何实现DateAdapter在整个应用程序中是单例的？对于其他模块，有一个 forChild() 与 forRoot() API，但不适用于 datepicker 模块。

对我来说问题是我导入了我的DateAdapter in my SharedModule然后导入SharedModule in my AppModule以及其他 LazyModule 中。

为了使DateAdapter您应该提供的单例服务DateAdapter您仅在应用程序的根级别使用一次，而不是在根级别和 LazyModules 中使用。

为此，请确保导入提供以下功能的模块DateAdapter, e.g. MatNativeDateModule，仅在你的AppModule（或者像 CoreModule 这样只导入一次的另一个根模块）。不导入MatNativeDateModule在多个模块中或在多次导入的模块（如 SharedModule）中。

import { MatNativeDateModule } from '@angular/material/core'

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    MatNativeDateModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

然后您可以在 AppComponent 中设置区域设置。

export class AppComponent implements OnInit {
  constructor(private dateAdapter: DateAdapter<Date>) {}

  ngOnInit(): void {
    this.dateAdapter.setLocale('en')
  }
}

具有设置区域设置的相同 DateAdapter 将被注入到您的 LazyModule 中。