【问题标题】:Angular localization: just switch language, no translation neededAngular 本地化:只需切换语言,无需翻译
【发布时间】:2017-12-04 17:34:43
【问题描述】:
我一直在研究 Angular(不是 AngularJS)如何处理本地化,似乎一切都围绕着提供翻译服务为您提供翻译文本。这似乎比我实际需要的要多得多。我正在编写一个网站,该网站将提供英语和西班牙语的仪表板,而我所需要的只是一项服务,该服务显示我们已经根据用户选择的一种语言或另一种语言翻译的文本。我是否仍需要使用相同的方法,只是跳过翻译服务部分,或者你们知道另一个只负责切换语言的库吗?
我是 Angular 的新手(我来自 .NET 世界 - 本地化的管理方式略有不同),因此非常感谢任何帮助。
谢谢。
【问题讨论】:
标签:
angular
internationalization
【解决方案1】:
你可以看看ngx-translate。
它基于经典的原始键值对,可以通过翻译文件或其他自我实现的加载方法(如对文件的 http 调用)提供(如果您不想通过应用提供翻译文件)。该服务通常使用默认语言和备用语言启动。您可以以编程方式切换语言,然后该服务将尝试加载另一个输入文件(或您为获取语言翻译而实施的任何内容)。这是启动和切换语言的示例。
constructor(private translate: TranslateService) {
// this language will be used as a fallback when a translation isn't found in the current language
this.translate.setDefaultLang('en');
// the lang to use, if the lang isn't available, it will use the current loader to get them
this.translate.use('en');
}
switchLanguage(language:string) {
// switch to another language
this.translate.use(language);
}
翻译值可以通过多种方式绑定到前端,有些可以在更改语言时甚至不必重新加载任何内容,它会自动切换所有值,但它们的使用受到限制。其他方式可能需要重新加载当前显示的组件。
这是一个无需重新加载即可工作的示例。
<!-- translation value with the key "hello" in the currently set language -->
<div translate>hello</div>
欲了解更多信息,请查看他们的页面,它有很好的文档记录。