组件内的Angular2 HTML

BünyaminSarıgül:

我想创建一个像模板一样的组件。例如,与其在各处编写:

<div class="myClass">
    <div class="myHeader" id="headerId"> Title </div>
    <div class="myContent" id="contentId"> <<Some HTML code>> </div>
</div>

我想使用像这样的组件:

<my-component title="Title" headerID=headerId contentID=contentID>
    <<Some HTML code>>
</my-component>

我该如何在Angular2中实现类似的功能?

j2L4e:

<ng-content></ng-content>在您的组件中使用

my.component.html

<div class="myClass">
    <div class="myHeader" id="headerId"> Title </div>
    <div class="myContent" id="contentId"> <ng-content></ng-content> </div>
</div>

parent.component.html

<my-component title="Title" headerID=headerId contentID=contentID>
    <<Some HTML code>>
</my-component>

里面的东西<my-component></mycomponent>都会被渲染成<ng-content></ng-content>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

从Angular2中的HTML调用组件方法

Angular2:HTML组件中的循环打字稿字典

Angular2:克隆组件/ HTML元素及其功能

如何在angular2中的父组件中访问子组件HTML元素值?

Angular2:如何在组件内部显示组件标签的内部HTML?

Angular2:获取组件内部html元素的引用,然后滚动到该html元素的顶部

Angular2 测试 Html

Angular2 HTML的布局

如何在Angular2的模板HTML上呈现动态创建的数组组件?

无法在Angular2中找到导入组件的模板html

Angular2本地化重新加载组件HTML

如何使用单独的templateUrl html文件npm发布Angular2组件?

无法将表格数据从html(view)传递到angular2中与其关联的组件

Angular2 / 4/6将自定义管道过滤列表从HTML传递到组件

如何在 Angular2 中将组件的 html 设置为 iframe

带有选择器的Angular2组件不在html中

在Angular2内扩展PrimeNg组件

组件内的Angular2 NgFor

从Angular2组件将对象作为参数传递时,未调用外部HTML文件中的JavaScript函数

html 不会从 angular 2 组件内部呈现

Angular2:HTML替换为空

Angular2管道:输出原始HTML

Angular2 AOT用于动态HTML

angular2 中的 HTML 输入值

我们可以将html模板从angular2中的一个组件传递到另一个组件吗?

Angular-CLI / Angular2:非标准字符只能在index.html中正确加载,而不能通过ng serve在组件中正确加载

反转Angular组件的HTML

Angular 2:从 Web 服务渲染 Angular html 组件

如何在一个index.html文件中从不同文件夹加载多个angular2组件?