你要找的是
Content Projection
.
只是使用
<ng-content></ng-content>
在要动态注入内容的组件中。
hello.component.ts你好
@Component({
selector: 'hello',
template:
`<div>
<div>hello component intro</div>
<ng-content></ng-content> <!-- CONTENT WILL BE ADDED HERE -->
<div>hello component outro</div>
</div>`
})
export class HelloComponent{}
惯例用法
<hello>
<div>This is my component</div> <!-- This is the injection I'm looking for -->
</hello>
它将产生
<div>
<div>hello component intro</div>
<div>This is my component</div> <!-- This is the injection I'm looking for -->
<div>hello component outro</div>
</div>