Question

我们决定给它一个旋转，我们使用Angular2开始新项目。到目前为止一直很好，但此时我们正面临一个问题。在这一点上，对于Angular2，i18n的正确方法是什么？我们研究了一下，发现了这个：

https://github.com/angular/i18n

然而，最后一次提交超过5个月......看起来不像是积极的开发。

有人试过使用angular-translate或angular-gettext吗？或者也许使用Angular2，包装像i18next这样的JS更好吗？有谁可以分享他们的想法？也许你遇到了同样的问题？

Answer 1

Plunk已更新为Angular 2 最终：https://plnkr.co/edit/4euRQQ。事情看起来和RC7一样。

新的i18n部分已添加到Angular 2官方文档中。基本上，它详细解释了上面的plunkr中发生的事情。

XLIFF是唯一的翻译格式，没有 json 支持。应使用ng-xi18n工具创建翻译源文件（xliff，xlf）：

<强>的package.json ：

"scripts": {
  "i18n": "ng-xi18n", 
  ...
}

和

npm run i18n

有关将翻译合并到组件模板的详细信息，请参阅Merge translation部分。它是使用 SystemJS Text 插件完成的。

使用Gulp http://www.savethecode.com/angular2-i18n-native-support/

的另一个例子

年长员工：基于 RC7 的更新和 Herman Fransen提供的链接：

我做了一个最小的Plunkr示例：https://plnkr.co/edit/4W3LqZYAJWdHjb4Q5EbM

对plunkr的评论：

bootstrap应提供TRANSLATIONS，TRANSLATIONS_FORMAT，LOCALE_ID的值 - ＆gt;设置翻译
html-templates中的可翻译项目应使用指令i18n
翻译存储在.xlf文件中。语言之间的关系是通过Id完成的，与 html 的关系是<source>

xlf

目前xlf个文件未直接使用;手动创建.ts文件以将xlf的内容包装在可导出变量中。我想，这应该在最终版本中自动运行（甚至可能在现在）。

这是我发现的第一个正式记录的方法。但是，它仍然几乎无法使用。我在当前的实现中看到了以下问题：

语言设置为bootstrap，无法在运行时更改它。这应该在Final中改变。
生成xlf中可翻译项目的ID。获取此ID的当前方式有点混乱：您创建一个新的可翻译项目，使用它，从错误中复制SHA id并粘贴到您的i18n.lang.xlf文件中。

关于i18n

有一个很大的文档pull request

年长员工：发行说明https://github.com/angular/angular/blob/master/CHANGELOG.md有记录

i18n ：合并翻译7a8ef1e

Angular 2 RC5

中引入了很多 i18n

不幸的是，仍然没有可用的文档。

Answer 2

每个人都渴望正式实施，但这个用于我的用例： https://github.com/ocombe/ng2-translate

README是相当彻底的，如果你需要一些特别的东西（对我而言是代码分裂），代码本身不会太长或难以阅读。

Answer 3

支持i18n现已成为Angular 2 RC6的正式版

官方发布博客：
https://angularjs.blogspot.nl/2016/09/angular-2-rc6_1.html

使用Angular 2 RC6的国际化样本
https://github.com/StephenFluin/i18n-sample

更多信息i18n的新概念如何在angular2中工作：
https://lingohub.com/blog/2015/03/angular-2-i18n-update-ng-conf-2015

Answer 4

我找到了另一种使用pipe和service

实现此目的的方法

<强> HTML

<!-- should display 'hola mundo' when translate to Spanish -->
<p>{{ 'hello world' | translate }}</p>

<强>打字稿

...

// "this.translate" is our translate service
this.translate.use('es'); // use spanish

...

// should display 'hola mundo' when translated to Spanish
this.translatedText = this.translate.instant('hello world'); 

...

https://scotch.io/tutorials/simple-language-translation-in-angular-2-part-1 https://scotch.io/tutorials/simple-language-translation-in-angular-2-part-2

Answer 5

Angular.io中有i18n官方支持：

https://angular.io/docs/ts/latest/cookbook/i18n.html

但是！正如文档中提到的那样：

您需要为其构建和部署单独版本的应用程序每种支持的语言！

这使得这个功能在大多数情况下都无用......

除非您在没有CLI的情况下使用它，如下所述：

https://devblog.dymel.pl/2016/11/03/angular2-and-i18n-translate-your-app/

Answer 6

我正在组建一个POC并且官方文档至少可以说是麻烦的，所以我尝试了ngx-translate http://www.ngx-translate.com/并且我确实让hello世界在几分钟内工作，几乎没有注意事项：< / p>

我读过那些抱怨性能的人，因为管道，但是阅读github问题，似乎它已经得到解决
仅适用于i18n或Translations，它不涉及i10n或本地化
Angular4几乎没有警告错误，但无论如何都可以使用

长话短说我喜欢ngx-translate如果你有一个小应用程序而且只需要翻译

我个人想要本地化，所以我在看 https://github.com/robisim74/angular-l10n 。它看起来很不错，但我还没有经过测试，所以我稍后会告诉你，或者你们可以去，我们都试试

Angular2 i18n此时？

6 个答案: