组件是否可以根据参数切换到不同的模板

Can a component have different templates to switch to based on a parameter

情况

我需要编写一个组件来将内容加载到页面上。内容(JSON 包含对象的数组)是从数据库加载的。两个组件必须创建一个页面。组件树看起来像这样。

DataList - receives full JSON object
  DataListItem - must display the first object
  DataListItem - must display the second object
  DataListItem - and so on

DataListItem可以多种方式显示内容。这就是为什么它需要多个模板。

我不想将所有内容都放在一个 HTML 文件中,添加一个 ngSwitch 指令并收工。我也不想为每个模板制作一个组件。我有大约 72 个模板。我只想要多个可以加载到 DataListItem 组件中的 HTML 文件。


我是怎么解决的

现在我正在尝试执行 HTTP 请求以获取模板,这似乎可行。

但是{{ data.contentId }}似乎没有绑定。它只是将绑定显示为页面上的纯文本。 Example here

我想知道如何才能做到这一点,或者是否可能。

提前致谢;)


编辑

我只是要找到这个问题的根源。是否可以在组件中加载不同的模板?父组件提供的参数应该告诉应该选择哪种类型的模板。

抱歉,我的大脑不再工作了,我必须编写很多代码才能将其转储到 plunker 上。它还连接到 API,因此您甚至无法加载数据。

我最终找到了 p3x-angular-compile,它可以编译您通过的 HTML。我请求 HTML 仍然使用 HTTP。这样我就可以拥有多个包含我要使用的模板的文件。

just for the person with the same problem. You need Nodejs 10.5.0+ for this plugin to work

无论如何,谢谢你的帮助。