问题描述
限时送ChatGPT账号..我是 angular 4 的新手.
我对 angular 4 嵌入式组件有疑问.
示例:
<英雄列表><英雄></英雄><英雄></英雄></英雄列表>
我想知道如何基于这种将组件嵌入另一个组件中的结构创建视图.
解决方案你应该在 hero-list
中使用
代码>-组件.这样你就可以实现上面的愿望了.
hero-listponent.html
<h1>英雄列表</h1><ng-content></ng-content>
现在你可以包装你的 hero-item
-components,它们将被打印在 hero-list
components 内.
appponent.html
<英雄列表><英雄物品></英雄物品><英雄物品></英雄物品></英雄列表>
这是工作示例:https://stackblitz/edit/angular-nvpmtc
而且这里 是一篇关于内容投影的好文章角度.
I am new to angular 4.
I have a doubt in angular 4 embedded components.
example:
<hero-list>
<hero></hero>
<hero></hero>
</hero-list>
I wanted to know how to create a view based on this structure that is embedding component inside another component.
解决方案You should use <ng-content></ng-content>
in your hero-list
-component. So you can realize your wish above.
hero-listponent.html
<div class="hero-list">
<h1>Hero list</h1>
<ng-content></ng-content>
</div>
And now you can wrap your hero-item
-components and they will be printed inside of hero-list
component.
appponent.html
<hero-list>
<hero-item></hero-item>
<hero-item></hero-item>
</hero-list>
Here is working example: https://stackblitz/edit/angular-nvpmtc
And here is a good article about content projection in angualr.
这篇关于如何在 Angular 中使用内容投影(又名嵌入)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论