如何在 Angular i18n 路由器模块中使用 LOCALE_ID

我正在使用 Angular 的 i18n 设置构建一个小型 Angular 应用程序。除了 url 路径和 slugs 的翻译之外，一切都工作正常。我尝试了一种可能的解决方案，为每种语言提供一个路由模块（如此处所述），但这不起作用。

我以为我可以做类似下面的事情，但我不知道在哪里注入LOCALE_ID:

应用程序路由.module.ts

import { LOCALE_ID, NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { MainComponent } from './main/main.component';

const i18nRoutes = {
    de: {
        main: 'inhalte',
        // ...
    }, 
    fr: {
        main: 'contenu',
        // ...
    }
}

const currentLanguage = i18nRoutes[ LOCALE_ID ]; // <-- Apparently not working, since I have to inject LOCALE_ID. But where?

const routes: Routes = [
    {
        path: '',
        redirectTo: currentLanguage.main,
        pathMatch: 'full'
    },
    {
        path: currentLanguage.main + '/:key',
        component: MainComponent
    }
    // ...
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

更新以澄清

in angular.json，我为每种语言的构建过程设置了配置（取自here https://medium.com/@feloy/deploying-an-i18n-angular-app-with-angular-cli-fc788f17e358，2018 年的视图修改）

角度.json

{
    // ...
    "projects": {
        "my-app": {
            // ...
            "architect": {
                "build": {
                    // ...
                    "configurations": {
                        // ...
                        "de": {
                            "i18nFile": "src/i18n/de.xliff",
                            "outputPath": "dist/de",
                            "i18nFormat": "xlf",
                            "i18nLocale": "de",
                            "baseHref": "/de/"
                            // ...
                        },
                        "fr": {
                            "i18nFile": "src/i18n/fr.xliff",
                            "outputPath": "dist/fr",
                            "i18nFormat": "xlf",
                            "i18nLocale": "fr",                            
                            "baseHref": "/fr/",
                            // ...
                        }
                   }
              }
          }
     }
}

为了一次构建所有应用程序，我然后输入npm run buildall，它执行以下内容package.json:

包.json

{
    "name": "my-app",
    // ...
    "scripts": {
        // ...
        "buildall": "for lang in de fr;do ng build --configuration=$lang; done"
    }
}

它会在子目录中生成所有应用程序dist文件夹就好了。

那么，回到我原来的问题：所提供的由网友 灭虫者 提供的答案 https://stackoverflow.com/a/52333393/1107529不符合我的需要，因为

• 我无法在引导时设置固定区域设置
• 注射LOCALE_ID在构造函数中为时已晚，因为我需要中的值app-routing.module.ts

我希望我解释得足够多了。但也许我完全误解了一些事情。无论如何，提前感谢您的帮助。我仍在学习中，我必须承认一些概念对我来说仍然模糊。

将其添加到 app.module

providers: [{provide: LOCALE_ID, useValue: 'fr-FR'}]

然后在你想要的地方使用以下方法调用它

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

  constructor(@Inject(LOCALE_ID) locale: string){
    console.log('locale', locale);
  }

你也可以使用这个方法

platformBrowserDynamic([{provide: LOCALE_ID, useValue: 'en-EN'}]).bootstrapModule(AppModule, {providers: [{provide: LOCALE_ID, useValue: 'en-EN'}]});