Angular 5国际化 [英] Angular 5 internationalization

查看:120
本文介绍了Angular 5国际化的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用最新的Angular5构建应用程序,我需要的是用户能够切换语言。我从来没有在Angular2 +中实现它(实际上我在使用Angular5)。

I'm building an application using the latest Angular5 and what I need is for a user to be able to switch languages. I've never had to implement this in an Angular2+ (actually I'm using Angular5).

我需要在两个地方设置翻译:

I need to set translations in two places:


  • 组件的模板html-将标签更改为指定的语言

  • 在component.ts文件的代码中-我可能需要翻译一些在特定条件下在代码中动态生成的
    字符串
  • >
  • Component's template html - change labels to the specified language
  • In code in the component.ts file - I may need to translate some strings that are built dynamically under particular conditions in the code

我在看 ngx-翻译,它看起来可以满足我的所有需求,因为它允许您更改语言而无需重建代码,请参见此处。但是我读了由于主要开发人员转向

I was looking at ngx-translation and it looks to do everything I need, as in it allows you to change language without rebuilding your code, see here. However I read it was probably going to be deprecated due to the main developer moving to the angular team to develop their i18n code.

我也了解当前的 i18n 目前不支持我需要的所有内容,请参见此处

I also understand that the current i18n doesn't support everything I need right now, see here.

我的问题-最新版本的Angular中的翻译状态如何?人们是否还会推荐其他库,如果确实的话,Angular本身还没有得到完全的支持(更改语言而无需重新编译)? ngx-translate对将来有好处吗?

My question - what is the state of play for translations in the latest version of Angular? Are there other libraries people would recommend instead, if indeed, Angular itself hasn't got full support as of yet (for changing language without recompiling)? Is ngx-translate good for the future?

此领域的任何指导都将受到赞赏!

Any guidance in this area is greatly appreciated!

推荐答案

花了很多时间研究之后,我认为我应该发布在 ngx-translate Angular-i18n

After spending time looking into this, I thought I'd post the main differences I found between ngx-translate and Angular-i18n:


  • Angular一次只能使用一种语言,因此您必须完全重新加载应用程序才能更改lang。对JIT的支持仅意味着它可以与JIT一起使用,但是您仍然必须在引导程序中提供翻译,因为它将在编译期间替换模板中的文本,而此lib使用绑定,这意味着您可以随时更改翻译。 。缺点是绑定占用内存,因此Angular方式更具性能。但是,如果您对组件使用OnPush,您可能永远不会注意到差异

  • Angular目前仅支持在模板中使用i18n,我正在研究允许您使用的功能它在您的代码中,但仍在进行中。此库在代码和模板中均可使用

  • Angular支持XLIFF或XMB(均为XML格式),而此库默认情况下支持JSON,但您可以编写自己的加载器以支持任何格式您想要的(例如,有一个用于PO文件的加载器)。就个人而言,Json文件比其他格式更易于读取,但这并不是一个巨大的缺点。

  • Angular支持ICU表达式(复数和select),但是该库不支持。 t

  • Angular支持html占位符,包括角度代码,而该库仅支持常规html(因为它是在运行时执行的,而不是在编译过程中执行的,并且在Angular中没有$ compile像以前那样

  • 该库的API更完整,因为它在运行时执行,它可以提供Angular没有的更多东西(可观察到的事件...)。确实不需要,因为您不能更改翻译。)
    ngx-translate的创建者说过:

  • Angular only works with one language at a time, you have to completely reload the application to change the lang. The JIT support only means that it works with JIT, but you still have to provide the translations at bootstrap because it will replace the text in your templates during the compilation whereas this lib uses bindings, which means that you can change the translations at any time. The downside is that bindings take memory, so the Angular way is more performant. But if you use OnPush for your components you will probably never notice the difference
  • Angular only supports using i18n in your templates for now, I'm working on the feature that will allow you to use it in your code, but it's still a work in progress. This lib works both in code and templates
  • Angular supports either XLIFF or XMB (both are XML formats), whereas this lib supports JSON by default but you can write your own loader to support any format that you want (there's a loader for PO files for example). Personally, Json files are quite straight forward to read through rather than these other formats, but that’s not a huge drawback.
  • Angular supports ICU expressions (plurals and select), but this library doesn't
  • Angular supports html placeholders including angular code, whereas this library only supports regular html (because it's executed at runtime, and not during compilation, and there is no $compile in Angular like there was in AngularJS)
  • The API of this library is more complete because it is executed at runtime it can offer more things (observables, events, ...) which Angular doesn't have (but doesn't really need given that you cannot change the translations) The creator of ngx-translate has said this:

Ocombe (ngx的开发者):@josersleal正是他们所做的,
角队聘请我为每个人改善i18n但是没有
的方法可以将我的lib直接集成到核心中,在为核心团队工作了3个
个月之后,我可以告诉您Angular i18n比我的
更为复杂和复杂库它处理了很多更复杂的
东西,并且没有我的
lib所具有的所有错误和缺点。我知道令人沮丧的是,核心
的发展速度没有图书馆能做到的那么快,但是
的原因是有原因的,第一个原因是您无法实现某些东西,而
每当您发现忘记包含用例时,请进行更改。
一切都必须经过彻底的计划和思考。尽管如此,在
的未来中,
仍具有该lib可以在核心中执行的大多数操作,但不幸的是,可能要花一年的时间才能到达那里。
好​​消息是,它将比我幼稚的
实现要好得多。

Ocombe (developer of ngx): @josersleal that's exactly what they did, the angular team hired me to improve i18n for everyone But there is no way to integrate my lib directly into the core, after working for 3 months for the core team I can tell you that Angular i18n is much more complex and elaborate than my lib. It handles a lot of more complex stuff, and it does it without all the bugs and shortcomings that my lib has. I understand that it's frustrating that the core doesn't evolve as fast as what a library can do, but there are reasons for that, and the first one is that you cannot implement something and change it whenever you see that you forgot to include a use case. Everything has to be thoroughly planned and thought. Still, you will have most of the things that this lib can do in the core in the future, but it might take a year before we get there unfortunately. The good news is that it's going to be much better than my naive implementation.

讨论ngx-translate和Angular i18n之间的主要区别的好文章: https://github.com。 com / ngx-translate / core / issues / 495

This is a good article to discuss the main differences between ngx-translate and Angular’s i18n: https://github.com/ngx-translate/core/issues/495

i18n的更改应在angular版本6中进行。今天,我们当前正在使用版本5:

The changes for i18n are due in version 6 of angular. Today, we are currently on version 5:


  • 它不是5.0版,应该在6.0版之前(因此2018年3月)。不幸的是,我没有更准确的日期

  • It won't be for 5.0, it should be before 6.0 (so before march 2018). Unfortunately I don't have a more precise date

ngx-translate的开发者(现在是angular-i18n的主要贡献者)发布了这12天前:
https://github.com/angular/angular/issues/20193

The developer of ngx-translate (and now a main contributor to angular-i18n) has posted this 12 days ago: https://github.com/angular/angular/issues/20193

以下是i18n的设计文档(现有技术部分很有趣):
>://://.google.com/document/d/1LH7lJ1GjRgpGUjzNb6Eg4xJPYYR> b $ b

Here’s the design document for i18n (the Prior Art section is interesting): https://docs.google.com/document/d/1LH7lJ1GjRgpGUjzNb6Eg4xrPooRdi80QOTYYh8z_JyY/edit#

一些想法…


  • Angular-i18n的性能更高您可以使用所需的语言来编译应用程序(而不是在运行时进行翻译)。这可能也是一个缺点,因为您可能需要使用不同的语言构建多个应用程序。

  • 如果我们使用SEO,则由于URL浏览,angular-i18n将是前进的方向。对于我来说,我根本不需要这个。

  • 如果我们需要复数转换等。同样,我也不需要此–我只需要一个相当简单的运行时语言切换

  • Angular-i18n至少要等到2018年3月才能发布。对我来说,我迫不及待要等到现在开始构建我的应用程序。

  • ngx-translate将不再具有与angular-i18n BUT一样全面的功能,我只需要简单的运行时翻译,所以认为它可以满足我们的需求。

  • ngx-translate是开源的,并且已经不再开发了,如果有严重的问题,我想我可以解决我自己(希望到时,所有可能出现的问题都将得到解决)。

  • Angular-i18n is more performant as you compile your application in the language you require (rather than translations happening at runtime). Can also be a drawback as you may need to have multiple builds of your application in different languages.
  • If we were using SEO, angular-i18n would be the way forward, due to url browsing. For my case, I don’t need this at all.
  • If we required plural switching etc. Again, I don’t need this – I just need a fairly straight forward runtime language switch in templates and code.
  • Angular-i18n wont be released until March 2018 at least. For me I cant wait until then as I need to build my app now.
  • ngx-translate won’t have as comprehensive a set of capabilities as angular-i18n BUT again, I only need simple runtime translations, so think its fine for what we need.
  • ngx-translate is open source and come the day it’s no longer being developed, if there's a serious issue I guess I could fix myself (hopefully by the time that comes, any issues that may arise will be ironed out).

来看一下Angular-l10n库,因为它看起来非常好:

I am also going to have a look at the Angular-l10n library as it looks very good:

  • Angular-l10n - https://github.com/robisim74/angular-l10n

这篇关于Angular 5国际化的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆