Angular 动态加载角度为9的组件

我动态加载了一些组件，现在使用Angular 9非常容易

const output = import(`./components/foo/foo.component`)
  .then(({ FooComponent }) => FooComponent);

然而，在我的例子中，这些惰性组件的数量将会增加，所以我想做类似的事情

const output = import(`./components/${name}/${name}.component`)
  .then(output => output[determineComponentName(name)]);

---

但是，如果您这样做，angular无法在构建期间确定要为哪些组件创建单独的捆绑包/文件。是否有某种方法可以告诉angular在构建期间这些组件是什么？

您应该为所有动态组件使用专用模式，例如

导入（'./components/dynamic/${name}/${name}.component'）

来自文档

，例如导入（

/locale/${language}.json

）将导致./locale目录中的每个.json文件被捆绑到新块中

非常感谢，您的建议很有效。我只需要将

src/app/components/dynamic/***component.ts

添加到tsconfig.json:）的

includes

部分，您应该为所有动态组件使用专用模式，例如

import（'./components/dynamic/${name}/${name}.component'）

From docs

例如，import（

/locale/${language}）.json

）将导致./locale目录中的每个.json文件被绑定到新块中

，非常感谢，您的建议很有效。我只需要将

src/app/components/dynamic/***component.ts

添加到tsconfig.json:）的

includes

部分