在 Typescript 和 Angular 中导入运行时可配置 JSON 7

Question

我的应用程序中有一个运行时翻译系统，在切换到 Angular 7 之前使用 http 请求加载充满翻译的 JSON 文件，如下所示：

loadLanguage(lang: string) {
    this.http.get('assets/lang/' + lang + '.json)
        .toPromise()
        .then((translations) => this.translations = translations; ) 
}

作为 Angular 7 升级的一部分，我决定尝试直接导入 json 而不是使用 http 来获取它。这是我实现它的新方法：

async loadLanguage(lang: string) {
    this.translations = await import('assets/lang/' + lang + '.json);
}

这在更改语言方面符合我的预期，但我遇到的问题是在编译后更改 JSON 文件对导入的输出没有影响。

从编译生成的包来看，所有导入的文件似乎都被编译成块，然后在我请求特定的 json 文件时加载这些块。我是不是对这些导入有错误的想法，以及它们在与 webpack 一起使用时如何工作，或者在重构我的解决方案时我是否遗漏了一些明显的东西？

谢谢

Answer 1

我认为你不应该这样做。由于 import() 被转换为 required() post 编译。另外，这不是 Angular 功能，而是 TypeScript 功能。这里有一篇关于类型 https://blog.mariusschulz.com/2018/01/14/typescript-2-4-dynamic-import-expressions

的非常详细的文章

作为建议，您应该使用 http 调用来下载动态运行时配置。

在 Typescript 和 Angular 中导入运行时可配置 JSON 7

Importing Runtime-Configurable JSON in Typescript and Angular 7

typescript

angular

angular7