<!-- app.component.html --> <h1>Single slot transclusion</h1> <app-card> <!-- header --> <span card-header>New <strong>header</strong></span> <!-- body --> <div card-body> <h4>You can put any content here</h4> <p>For example this line of text and</p> <a href="#">This button</a> </div> <!-- footer --> <span card-footer>New <strong>footer</strong></span> <app-card>
小结
使用包含组件, 可以将布局提取成组件, 动态指定加载的内容, 应该也是很常用的。 而至于选择符 (select), 则建议使用属性, 这样可读性比较好, 也不会破坏 html 的结构。