2015-12-11 5 views
1

У меня есть родительский компонент и дочерний компонент. Я хочу, чтобы иметь возможность вызвать некоторый дочерний метод для дочернего компонента из некоторого метода в родительском компоненте. Есть ли способ получить ссылку на экземпляр дочернего компонента в классе родителя и вызвать общедоступные методы пользователя?Выполнить метод для дочернего компонента

@Component({ 
    selector: 'child-component' 
}) 
@View({ 
    template: `<div>child</div>` 
}) 
class ChildComponent{ 
    constructor() { 

    } 

    doChildEvent() { 
     // some child event 
    } 
} 

@Component({ 
    selector: 'parent-component' 
}) 
@View({ 
    template: ` 
     <child-component #child></child-component> 
    `, 
    directives: [ 
     ChildComponent 
    ] 
}) 
class ParentComponent { 
    private child:ChildComponent; 

    constructor() { 

    } 

    onSomeParentEvent() { 
     this.child.doChildEvent(); 
    } 
} 

Я пробовал помещать хэш на ребенка в шаблон и ссылаться на него в классе, но не добился успеха.

+0

'# child' - эти локальные переменные шаблона не становятся свойствами компонента (как вы обнаружили). Я не могу найти что-либо в документации об их охвате (и мне не хочется смотреть на исходный код). Кажется, что их рамки ограничены шаблоном. –

ответ

5

Это то, что ViewChild для:

//don't forget to import ViewChild 

class ParentComponent { 
    @ViewChild(ChildComponent) private child:ChildComponent; 

    constructor() { 
     //this.child is undefined because constructor is called before AfterViewInit 
    } 

    onSomeParentEvent() { 
     //this.child contains the reference you're looking for 
     this.child.doChildEvent(); 
    } 
} 

Предполагая, что onSomeParentEvent обжигают после AfterViewInit, this.child будет содержать ссылку на компонент ребенка.

+0

Только то, что я искал! – Sagi

Смежные вопросы