在Angular2中注入模板HTML部分

栏目: Html · 发布时间: 5年前

内容简介:花了几个小时后,使用ngTemplateOutlets,componentFactoryResolvers,以及使用ViewChild奇怪的东西来解决奇怪的兔子洞…我认为必须有更好的方法.我有一个组件,其html模板变得越来越大.纯粹出于组织目的,我想将一些html移动到子模板(其他文件)中.然后我想在我的主模板中只有一行来引入它们,但是所有内容的范围和上下文应该保持不变.我可以通过将所有内容包装在自己的组件中来实现它,但这似乎是一种浪费,我需要在整个地方安装@Output eventEmitters,看起

花了几个小时后,使用ngTemplateOutlets,componentFactoryResolvers,以及使用ViewChild奇怪的东西来解决奇怪的兔子洞…我认为必须有更好的方法.

我有一个组件,其html模板变得越来越大.纯粹出于组织目的,我想将一些html移动到子模板(其他文件)中.然后我想在我的主模板中只有一行来引入它们,但是所有内容的范围和上下文应该保持不变.

我可以通过将所有内容包装在自己的组件中来实现它,但这似乎是一种浪费,我需要在整个地方安装@Output eventEmitters,看起来像是浪费.

我发现最接近“好”的是[innerHtml],但显然这不起作用,因为Angular2不处理它引入的html.我真的很惊讶没有直接的方法来做这个…它不需要做任何思考只是一种简单的方法来注入一些正常处理的内联文本.

最佳解决方案看起来像

<div>
    all my regular content
</div>

<template [ngExternalTemplate]="./app/home/templates/my-template.html"></template>

并且在该模板中注入的所有html都可以访问,并且能够访问正常内联html所具有的范围和上下文中的所有内容.

关于如何解决这个问题的任何想法?我讨厌看到html变得庞大,但实际上它不应该分成多个组件,因为它们都管理相同的视图.

作为最后的手段,我想我可以用gulp取代一点动作,但这似乎超级hacky.


以上所述就是小编给大家介绍的《在Angular2中注入模板HTML部分》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

大话存储Ⅱ

大话存储Ⅱ

张冬 / 清华大学出版社 / 2011-5 / 99.00元

《大话存储2:存储系统架构与底层原理极限剖析》内容简介:网络存储是一个涉及计算机硬件以及网络协议/技术、操作系统以及专业软件等各方面综合知识的领域。目前国内阐述网络存储的书籍少之又少,大部分是国外作品,对存储系统底层细节的描述不够深入,加之术语太多,初学者很难真正理解网络存储的精髓。《大话存储2:存储系统架构与底层原理极限剖析》以特立独行的行文风格向读者阐述了整个网络存储系统。从硬盘到应用程序,对......一起来看看 《大话存储Ⅱ》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

随机密码生成器
随机密码生成器

多种字符组合密码

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具