如果缺少密钥或正在加载翻译文件，则 ngx-translate 默认文本

Question

我正在设置一个新的 Angular 7 应用程序。我想设置一个默认的翻译文本。所以在翻译中{{ 'wait' | 翻译}}，如果有任何后备，我想将文本“现在等待”设置为默认文本。意味着如果正在加载数据或缺少密钥，则应显示传递的值（在这种情况下正在等待）。

我试图做类似的事情 {{ 'Intro' | translate:'localizedText' }}

没有没有用

{{ 'Intro' | translate:'localizedText' }}

我希望结果应该是

{{ '介绍' | translate:'localizedText' }} => 介绍（如果正在加载或丢失密钥）

{{ '介绍' | translate:'localizedText' }} => 翻译文本

Answer 1

我按照说明在这里创建了一个缺失的翻译处理程序：https : //github.com/ngx-translate/core#how-to-handle-missing-translations

但是我的版本允许像这样将默认值传递给管道

<span>{{"MyTranslateKey" | translate: {Default: "Default Translation"} }}</span>

默认值可以是上述特定字符串或变量。

这是我的处理程序：

import {MissingTranslationHandler, MissingTranslationHandlerParams} from '@ngx-translate/core';

export class MissingTranslationHelper implements MissingTranslationHandler {
  handle(params: MissingTranslationHandlerParams) {
    if (params.interpolateParams) {
      return params.interpolateParams["Default"] || params.key;
    }
    return params.key;
  }
}

Answer 2

您将需要使用自定义的MissingTranslationHandler像这样：

在您app.module或您正在加载的任何地方TranslateModule.forRoot执行以下操作：

@Injectable()
export class MyMissingTranslationHandler implements MissingTranslationHandler {
    handle(params: MissingTranslationHandlerParams): string {
        return `**MISSING KEY: ${params.key}**`;
    }
}

并在您providers:[]添加此：（导入后MissingTranslationHandler）

{
    provide: MissingTranslationHandler,
    useClass: MyMissingTranslationHandler
},

请参阅此链接了解更多详细信息：

https://github.com/ngx-translate/core#how-to-handle-missing-translations

要返回缺失的默认值，您可以尝试以下操作：

1- 创建一个 object/json 来包含默认值，该 json 应包含与原始 json 相同的结构。

const alternativeJson = {  
       value1: 'default1'
}

handle(params: MissingTranslationHandlerParams): string {
        return this.alternativeJson[params.key];
}