Page 395 - AngularJS权威教程

27.10 字符串提取 375

27.9 用法 19

angular-gettext库包含translate指令，这是一个简单的指令，它可以被放置在那些包含
你想要翻译的字符串的DOM元素上。 20

<h1 translate>Hello!</h1>
21
<h1>的内容将使用我们稍后会定义的字符串译本自动翻译。

与普通的字符串相比，待翻译的字符串也会以同样的方式处理，angular-gettext提供的功 22
能完全支持从应用内部插值。
<h1 translate>Hello {{name}}</h1> 23

这还可以支持翻译复数表示法。例如，比如你想要将apple翻译为它的复数形式apples。

<h1 translate>One apple</h1> 24
你可以添加两个甚至更多指令给<h1>元素，来表示当前计数以及要翻译的最终字符串。
25
<h1 translate
translate-n="count"
translate-plural="{{ count }} apples">
One apple 26
</h1>
如果translate-n表达式的结果大于1，那么gettext就使用translate-pural中的字符串； 27
否则，它使用DOM元素<h1>的值。
这个附加的translate-n指令接受任意形式的Angular表达式，包括函数。关于表达式的更多 28
信息，请查看第6章。
translate-pural就是一个简单的字符串，它会在这个指令被调用时替换DOM元素内的值。 29

最后，你还可以在应用内使用translate过滤器。因为有时候我们不能使用指令，例如：
30
<input type="text" placeholder="Username"/>
还可以使用translate过滤器来替换占位符中Username的值。
31
<input type="text" placeholder="{{'Username' | translate }}"/>
32
27.10 字符串提取

现在，我们不再提前提供需要翻译的字符串，而是从模版中提取字符串来构建翻译。我们将 33
会生成一个.pot文件，也就是标准的gettext模板。
要提取那些要翻译的字符串，最简单的方法就是使用grunt-angular-gettext工具。 34

关于Grunt的更多信息，请查看34.3节。 35

为了使用grunt-angular-gettext这个Grunt任务，首先需要使用npm安装它： 36