如何翻译角6的枚举

Question

我试图翻译Angular的枚举，但问题是我不知道如何翻译它们。我可以阅读它们，我可以在下拉列表中显示但不能翻译。

以下是我的代码

export enum test {
 test1 = '1 - do something',
 test2 = '2 - do anything',
}

我读了这样的数据

public getEnum: any = {};

public ngOnInit(): void {
Object.values(test).map(a: string) => {

const id = a.substr(0, 5);
this.getEnum[id] = a;
}

在HTML中我有这样的东西

 [options]="getEnum"

翻译是这样的。

"dropdown": {
  "doSomething": {
    "test1": "1 - do something"
   }
}

Answer 1

我建议采取一些不同的方法。不要翻译它：保留enum键到translation.json文件，例如

export enum Test {
 test1 = 'dropdown.doSomething.test1',
 test2 = 'dropdown.doSomething.test2',
}

我的情况enum将不依赖于当前语言，您将能够轻松地从枚举中翻译价值：

const enTranslations = {
  dropdown: {
    doSomething: {
     test1: "1 - do something"
    }
  }
};

const getTranslatedText = (tranlations, keys: string[]) => keys.reduce((acc, curr) => acc[curr], translations);

const key1 = Test.test1
const translatedEnText = getTranslatedText(enTranslations, key1.split('.'));

然后你可以显示translatedEnText，或将其传递给函数调用。 translatedEnText === '1 - do something'

如果您想要使用不同语言的相同密钥中的文本，只需将getTranslatedText与其他翻译对象一起调用，例如deTranslations

如果要将枚举映射到具有相同键的对象，并且已翻译的值执行如下操作：

const testEng = Object.values(Test).reduce((acc, key) => ({ ...acc, [key]: getTranslatedText(enTranslations, key.split('.'))}), {})

reducde将从{}中的acc开始，并且在每个迭代步骤中，它将添加到getTranslatedText(enTranslations, key.split('.'))键下key（作为值）的acc翻译文本。

Playground