Angular4:用户的区域设置

LeO*_*LeO 8 internationalization angular

我希望有一个LoginForm,并在此用户输入应用程序后 - 使用德语或英语.据我所知,我可以设置app.module.ts类似的东西

import { LOCALE_ID } from '@angular/core';
providers: [{ provide: LOCALE_ID, useValue: 'de-DE' },...]
Run Code Online (Sandbox Code Playgroud)

但那是在启动时,而不是在LoginForm已经显示的时候: - /有没有办法改变整个应用程序的语言环境?(不仅仅是针对特定组件!) - 如果翻译可以随时更改,那将会很棒.任何提示如何实现?我只找到了上面的处理方式.

LeO*_*LeO 12

我按照这个帖子的答案,我有以下解决方案:

import { LOCALE_ID } from '@angular/core';

@NgModule({
  // ...
  providers: [...
     {provide: LOCALE_ID,
      deps: [SettingsService],      // some service handling global settings
      useFactory: getLanguage  // returns locale string
    }
  ]
  // ...
})
export class AppModule { }
// the following function is required (for Angular 4.1.1!!!)
export function getLanguage(settingsService: SettingsService) {
  return settingsService.getLanguage();
}
Run Code Online (Sandbox Code Playgroud)

注意:使用额外功能可以防止错误Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function!

我创建了这个类

import { Injectable } from '@angular/core';

@Injectable()
export class SettingsService {
  currentLang: string;

  constructor() {
    this.currentLang = 'en';
  }

  setLanguage(lang: string) {
    this.currentLang = lang;
  }
  getLanguage() {
    return this.currentLang;
  }
}
Run Code Online (Sandbox Code Playgroud)

它会LOCALE_ID随时改变:-)

  • 每当我改变当前的语言,而所有的`| 翻译`正确更新,`|中的月份 date`不会更新 (2认同)

小智 1

您在 app.module.ts 中所做的事情是执行此操作以及整个应用程序的正确方法:

@NgModule({
  // ...
  providers: [
    { provide: LOCALE_ID, useValue: 'de-DE'}
  ]
  // ...
})
export class AppModule { }
Run Code Online (Sandbox Code Playgroud)

但不幸的是,我认为不可能即时更改它。