如何从Angular 6的组件中提取文本进行翻译(ngx-translate)

时间:2018-07-23 14:35:27

标签: javascript html angular

我正试图找到一种方法来获取Angular 6项目文件(ts和样式以及html文件)中的所有文本字符串,以便使用文件路径自动生成嵌套的JSON对象。例如。在组件html文件中:

app / shared / forms / categories / categories.component.html:

<a id="input-categories">This string</a>
<a class="btn accept">This button</a>

提取后,在en.json中:

{
  "shared": {
    "forms": {
      "categories":{
         "a-input-categories": "This string",
         "a-btn-accept": "This button"
      }
    }
  }
}

我看过ngx-translate-extract,但它只会提取可翻译的{{ name.space.here | translate }}管道等。

如果这是不可能的,有没有一种方法可以使用某种默认标记(例如trans)以这种方式“标记”每个字符串:

<a id="input-categories" trans>This string</a>
<a class="btn accept" trans>This button</a>

我的问题是前端开发人员已经对所有内容进行了硬编码,现在我们正在寻找4位数字的字符串,这些字符串需要从标记和代码中提取出来进行翻译。

3 个答案:

答案 0 :(得分:1)

您可以ngx-translate-extractor

https://github.com/biesbjerg/ngx-translate-extract

ngx-translate-extract --input ./src --output ./src/assets/i18n/template.json

答案 1 :(得分:0)

一个可能对您有帮助的简单解决方案是:

<(.+)( .*)?>(.*[a-zA-Z]+.*)<\/\1>

将以下正则表达式写给文本编辑器中的替换工具,它将捕获其中包含文本的所有标签。

然后将第一个标签的内容替换为(对于VS Code)

<$1 i18n $2>$3</$1>

或其他编辑者:

<\1 i18n \2>\3<\/\1>

这会将每个<tag attribute="value" etc>stuff</tag>转换为<tag i18n attribute="value" etc>stuff</tag>

然后,您可以使用ng xi18n自动提取所有文本以翻译成XLIFF。

这假设您的html模板的格式如下:

<tag>
   <subtag> text </subtag>
</tag>

这意味着每行只能有一个带有文本的标签(同一行中的<tag><subtag>可能会引起问题),并且该文本与其封闭的标签在同一行中。

答案 2 :(得分:0)

您可以使用text2locale

npm install -g github:juliandavidmr/text2locale

提取并生成JSON文件:

text2locale input "./example/src" -o "./example/locale/" -l en -t es,de,zh