Angular布尔管道是/否本地化

Question

我需要一种方便的方法来获得我的是-否管道本地化像日期管道{{ my.date | date: 'short' : 'UTC' : 'de-DE' }}

之类的

{{ my.boolean | yesNo : "de-DE" }}

，而不是返回value ? "Yes" : "No";，我需要一些魔法:D

@Pipe({
name: 'yesNo'
})
export class YesNoPipe implements PipeTransform {

transform(value: boolean, ...args: unknown[]): string {
// need some magic
return value ? localizedYes : localizedNo;
}

}

Answer 1

不幸的是，不像Date可以很容易地使用JS本地化，一个简单的"Yes"或";No"字符串必须被翻译才能实现这一点。以下是我要实现这一目标的一些步骤:

1. 安装ngx-translate https://www.npmjs.com/package/@ngx-translate/core，并按照他们的指南进行设置，以及为您想要翻译的所有语言创建翻译资源文件。如果你不喜欢他们的文档，这里有一篇很棒的文章，有一个简单的指导https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular-app-with-ngx-translate
剩下的只是使用翻译服务和你的管道

@Pipe({
name: 'yesNo'
})
export class YesNoPipe implements PipeTransform {

transform(value: boolean, ...args: unknown[]): string {
return value ? 'KEY.YES' : 'KEY.NO';
}

}
...
{{ my.boolean | yesNo | translate }}

这有点痛苦，但这种设置将无限扩展到任何需要本地化/全球化的未来工作。