如何在Angular2中创建具有嵌套选择器的组件

时间:2016-10-13 08:36:09

标签: angular

我是angular2的新手,我正在尝试使用嵌套选择器构建一个组件。我该如何构建这样的组件。如果我的问题不清楚,请参阅下面我需要构建一个可以像这样使用的组件。我可以遵循任何方法或方法吗?请帮忙

 <parent [width]='100'>
        <child [title]='hi'></child>
        <child [title]='hello'></child>
 </parent>

2 个答案:

答案 0 :(得分:0)

正如jmachnik所说,在父模板中使用<ng-content>是嵌套不相关组件的最简单方法。 Angular2 故意不支持父子选择器。

// Does not work
@Component({
   selector:  'parent child',
   ...
})

如果你需要这样的东西,那么在父类中使用@ViewChildren或@ContentChildren属性注释将为你提供对子组件的引用。

我会将您推荐给angular api了解更多详情。

答案 1 :(得分:0)

您可以在父模板中提及子选择器,并将子组件导入Parent

import { Component,Input } from "@angular/core";
import {childSelector} from 'pathname for childselector file'
@Component({
    selector: "my-app",
    template: `
<childselector1></childselector1>
<childselector2></childselector2>
`
})
export class AppComponent {

}