Angular 2 - 获取组件实例

Question

我有两个这样的组件:

@Component({
    selector: 'comp1',
    template: `<h1>{{ custom_text }}</h2>`
})
export class Comp1 {
    custom_text:string;
    constructor(text:string) {
        this.custom_text = text;
    }
}

/*********************************************/

@Component({
    selector: 'comp2',
    directives: [Comp1],
    template: `
    <b>Comp 2</b>
    <comp1></comp1>
    `
})
export class Comp2 {
    constructor() {
        // ...
        // How to send my own text to comp1 from comp2
        // ...
    }
}

是否有可能从把我自己的文字comp1来comp2？

是否可以从中获取comp1实例comp2？

谢谢.

Answer 1

comp2是comp1的父级,所以

• 将数据从子节点发送到父节点(comp1到comp2)将一个OutputProperty添加到子 节点:
  @Output() someEvent = newEventEmitter();
  以及emit()它上面的事件:this.someEvent.emit('some text');
  父节点需要绑定到输出属性/事件:<comp2 (someEvent)="someHandler()"></comp2>
• 让一个孩子组件的一个实例(COMP2到达COMP1的引用)的引用,使用@ViewChild或@Query在COMP2:@ViewChild(Comp1) viewChild:comp1; 然后,您可以访问this.comp1的ngAfterViewInit(),还是后来在组件的生命周期.