我正在尝试将 a [formControl]（和其他顶级属性）附加到我使用 a 创建的对象，ComponentFactoryResolver以便使用 a 处理表单逻辑ControlValueAccessor。

基本上我这样做：

我想出这一点的唯一方法是进入 JIT 并使用 RuntimeCompiler，动态创建一个模板，如<my-component [formControl]="args" [otherValuableAttribute]="true"></my-component>. 编译它，然后获取实例。

但是，如果不关闭 AOT，我将无法运行它。

我在这里最好的选择是什么？

假设我们进行 API 调用并在 String 中获取一些 HTML DOM。内容以不带角度的 HTML 形式出现，因此我必须首先将其转换为我想要的 Angular，然后将其编译为 Angular。

示例 API 响应：

我正在对其进行转换以获取所有 Anchors<a href="x"></a>并将它们转换为具有输入和输出的角度组件，这些组件将被注入父容器并一起解析，例如：

angular-anchor包含一个 click 方法，该方法从这些组件外部但在 angular 内部（来自服务）执行代码。

通过[innerHTML]在父容器中使用，其中转换是由管道完成的，就像：

内部的 Angular 组件不会被加载，整个工作只是由管道转换中包含的 safeHTML 解析的原始 Angular。

为了解决这个问题，我使用了 ng-dynamic 库，但它已经过时并且与 AOT 编译不兼容。尽管如此，我还是设法将它与 JIT 编译一起使用，但这对生产不利，效率也低得多。

这种方法的示例，“parentDIV”是一个标准的 HTML 标记：

context包含新组件内部所需的所有依赖项，例如我在“angular-anchor”中使用的第三个服务

从这一点开始，我阅读了几篇关于Angular Elements或Dynamic Components Injector的文档，但我无法在我的应用程序中使用它。

使用我刚才提到的这些方法或任何其他方法来使用 AOT 提供的自定义角度组件有什么好的方法吗？

提前致谢。如果需要，请向我询问更多详细信息。

我需要能够在运行时使用生产构建（启用aot）动态创建模块和组件（使用不同的模板）。我知道这对于使用 JIT 编译器的开发版本是可能的。但我不希望这个用于我的生产版本

有没有办法延迟加载 JIT 编译器，以便它仅用于在生产构建中创建那些动态模块和组件？

目标

有了一个统一的代码库，我希望能够...

1. 使用 CLI 编译并使用生成的捆绑文件为整个应用程序提供服务
2. 使用 JIT 编译并为应用程序服务，每个文件都有自己的网络请求（无捆绑）

当前尝试

到目前为止，我已经为每个构建创建了单独的 tsconfig 文件。

我的主要困难是在 components 中为 templateUrl 设置路径。

CLI 默认使用 templateUrl 的相对路径，而 JIT 需要在组件上设置 moduleId 才能使用相对路径。

例如

...适用于开发模式（commonjs），但对于生产模式（CLI）失败，并出现以下错误：

找不到名称“模块”。您需要为节点安装类型定义吗？试试npm i @types/node。

删除 module.id 可用于 CLI，但不适用于 commonjs。在这种情况下，浏览器找不到 html 文件，因为它正在源根目录中查找。

我努力了..

• （有保留）安装节点类型
• 将“模块”转换为任何
• “模块”的环境声明，
  • 声明 const 模块：{id: any};
• 将模块包装在一个仅在 commonjs 场景中有条件地评估的函数中
  • IEmoduleId : environment.bundled ? undefined : (() => module.id)()

并且都因不同的原因而失败。

任何关于这种方法或新方法的建议将不胜感激。

Angular 文档指定了使用 AOT 编译来支持 JIT的几个原因：

• 更快的渲染
• 更少的异步请求
• 较小的 Angular 框架下载大小
• 更早地检测模板错误
• 更好的安全性

但是，在寻找使用 JIT 的参数时，我没有找到。此外，在从 Angular 5.2 升级到 Angular 8后，我在运行开发构建（使用 JIT）时突然遇到一个奇怪的错误。错误是：

运行产品构建（使用 AOT）时，一切都很好。这让我感到惊讶，因为我从未遇到过prod 构建成功而dev 构建失败的 Angular 编译问题。

所以我的假设是 JIT 只适用于开发构建（即速度）。添加--aot标志可以安全地完成，没有任何问题。还是我错过了什么？

我在 Angular 应用程序中使用旧的 gwt 应用程序。我没有比过去 gwt 应用程序进入资产目录并在 index.html 中使用入口点指定脚本更好的主意。在开发模式下，一切正常，这就是为什么我没有怀疑有任何坏事。但是在构建后--prod ...

这个 gwt 应用程序是一个独立的应用程序，它下载和运行 .js 文件、本地化文件、样式。我试图在 angular.json 'scripts' 部分提及带有入口点的文件。同样的错误。我还尝试从评论Angular AoT 和汇总中实现提示 - 错误：未加载运行时编译器 此应用程序还创建画布标签。可能是这导致了问题。

也是同样的结果。我不太期望有人遇到这种奇怪的情况。但我认为如果应用程序在开发模式下运行良好，那么有一种方法可以在生产模式下工作。有人知道怎么做。谢谢

大家好，我在迁移后遇到了 angular 问题，我已将项目从 angular 8 迁移到 angular 9 。带有 ng server --prod 的 Angular 在版本 8 中有效，但在版本 9 中出现错误。我已经检查了 ng build --prod 和 ng serve --prod。由于新的 Angular 9 具有用于 AOT 编译的 IVY 编译器，因此我在 main.ts 中导入了 angular/compiler，引导程序也注入了 platformBrowserDynamic，因为我可以看到 Angular 8/9 在开发模式下使用 jit 编译为 ng serve 所以项目是在 jit 上运行，但由于 angular 使用 aot 编译进行生产，我的代码库出现错误

pollyfills.ts `导入'@angular/compiler'；导入'@angular/localize/init'；导入'core-js/es/array'；导入'zone.js/dist/zone'；

`

`

tsconfig.json `

`

我在 ng serve --prod 或 ng serve --prod --aot=true 上的 chrome 控制台上遇到以下问题。 `

`

当我使用 ng serve 它在我的本地主机上服务时没有问题，但是当我添加 prod 关键字或尝试使用 ng build --prod 进行构建时。dist 文件夹在我的开发服务器上不起作用，我收到上述错误。

所以我一直在构建一个 Angular 9 应用程序，其中有一个客户仪表板来管理他们保存在服务器上的模板。这些模板可以通过激活系统在不同的设备上查看，以便将设备绑定到用户。

因此，假设https://templates.com我们有/login, /dashboards,/manage以及来自查看和编辑数据的子路径。在这个 url 上，我们/:companyName在这个路径上也有它请求一个模板，其中包含带有插值字符串的 html，还有 css，它将被动态加载。

到目前为止，由于alarm9k 的帖子，我能够实现这一目标。

此解决方案出现的唯一问题是，在构建应用程序时，您无法使用ng build --prod，因为 using--prod将不起作用，因为 AOT 中不包含角度编译器，因此您被困在 JIT 中。

这将导致更大的应用程序，在我的情况下，大小几乎是 42MB。所以我想减小文件大小，因为这会极大地影响应用程序的延迟。我一直在查看应用程序和 atm 的统计信息，它的延迟 http p95 延迟为 1.2 秒，http 平均延迟为 340 毫秒。

当使用不同的网站速度测试并选择英国作为测试应该运行的地方。我得到的加载时间值在 60​​0-900 毫秒左右。检查多个位置时，它给了我 5 秒的平均加载时间。

问题：

所以我想知道是否有办法将应用程序拆分为 2，其中一个处于 AOT 模式，另一个处于 JIT 模式，将一部分保持在 JIT 模式是否安全，是否可以最大限度地减少申请与否。

如果这是不可能的，我想知道最好的方法是最小化这个应用程序以及如何做到这一点。

或者，如果有一种方法至少可以使应用程序更安全，因为在 JIT 模式下可以在浏览器中查看所有代码。

编辑1：

我忘了提到，在我的情况下，我使用 socket.js 作为激活系统，因此仪表板和模板有些连接。因此，当/:companyname设备未连接时，它会自动转到/activate生成代码的位置并监听用户是否输入该代码，以便将设备连接到用户帐户。

编辑2：

我一直在阅读 ivy 可用于动态加载组件，因此仍然可以在 AOT 中，而无需编译器。这是可以做到的吗？如果可以，你如何做到这一点？

我正在将我的 Angular 库升级到版本 9，在我的项目中我使用 Angular v9.1.0。

我的库依赖于另一个内部 Angular 库。当我尝试构建我的库时，我得到了以下错误：

我检查了依赖库的代码，它是用 angular v9.0.5 开发的。

我的理解是角度/核心对这种方法的定义在 v9.1.0 和 v9.0.5 之间发生了变化。

我检查了 Angular 的变化，并确认了我的猜测和方法的变化。

仍然让我感到困惑的是为什么会发生上述问题。

我的理解是Angular库在构建和发布的时候，编译后会生成一些文件，在文件里面会导入angular/core的API，API会根据构建时Angular的版本.

在我的例子中，依赖库是用 v9.0.5 构建的。但我的图书馆使用 v9.1.0。这就是上述错误的原因。

我的理解正确吗？

在应用内容安全策略后，在 Angular 应用程序的 index.html 文件中，应用程序给出了“unsafe-eval”控制台错误，如下所示 -

当我尝试动态构建模块时，使用Compiler类中的compileModuleAsync()方法会导致此错误。

如果我不使用内容安全策略，那么应用程序可以正常工作并且不会给出这样的控制台错误。以下是政策详情——

根据调用堆栈的观察，Angular Framework 的以下函数部分使用new Function()表达式并导致安全问题 -

这是我试图构建用 loadChildren 编写的配置的 routes.json -

以下是构建模块的代码 -

另外，我正在为这个编译器使用 JitCompilerFactory -

如果有任何其他细节，请告诉我。任何建议都会非常有帮助。

以下是 stackblitz 的链接，此问题可重现 https://stackblitz.com/github/HimanshuGoel/unsafe-eval-issue?file=src%2Findex.html

如果我删除此 CSP，它会正确渲染 -