Angular 管道引用 Assets

Question

我正在构建 Angular 4 Pipe支持国际化。我想将管道发布为 npm 模块，供其他人使用。该管道将​​引用开发人员放入的 json 数据 /assets/i18n/<lang>.json像这样的文件:

{
  "welcome" : "Welcome",
  "register" : "Register"
}

并像这样用作管道:

{{ 'welcome' | i18n }}

从导入的管道中引用 json 文件的最佳方式是什么？当我尝试使用 require('assets/i18n/' + lang + '.json')从导入的模块加载 json，路径无法解析。我应该使用 HttpClient 吗？ get反而？如果是这样，如何将json数据同步到管道？

感谢您的帮助。

Answer 1

我建议使用 HttpClient.get 分支。在这里，您可以使用 i18n 管道 + async 管道来获得最终结果。

第一步是在管道的转换函数中返回 Observable。

constructor(private http: HttpClient) { }

transform(input) {
  return this.http.get(...);
}    

然后使用 i18n 管道和 async 管道自动订阅。

{{ 'welcome' | i18n | async }}

这是一个示例 demo .