组件是否可以根据参数切换到不同的模板
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
无论如何,谢谢你的帮助。
情况
我需要编写一个组件来将内容加载到页面上。内容(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
无论如何,谢谢你的帮助。