동적으로로드 된 구성 요소에서 함수 호출

Question

MainComponent에 자식 구성 요소가로드되는 <router-outlet>이 있습니다. /messages -url의 경우 messagesComponent이로드됩니다. 컨테이너에서 사용자가 스크롤이있는 <router-outlet>이 같이있는 경우에 나는 터집니다 MainComponent에 evenlistener을 추가 한 다음 onContainerScrollEvent 화재가 나는 새로운 메시지를 얻기 위해 messagesComponent에 함수를 호출 할

@Component({ 
    selector: "main-component", 
    template: ` 
     <div (scroll)="onContainerScrollEvent($event)"> 
      <router-outlet></router-outlet> 
     </div> 
` 
}) 
export class MainComponent { 
    private messagePage: number = 0; 

    onContainerScrollEvent(event: any) { 
     this.messagePage += 1; 
    } 
} 

. onInit에서 발생하고 자체 이벤트를 부모 이벤트로 전달하는 messagesComponent에 EventEmitter를 추가했지만 <router-outlet>은이를 지원하지 않습니다.

UPDATE 아흐메드의 답변을 통합하는 내 질문에 대한 답 아래 :

이고 MessageService :

import { Injectable } from '@angular/core'; 
import { Subject } from 'rxjs/Subject'; 

@Injectable() 
export class MessageService { 
    private messagesPageSource = new Subject<number>(); 
    messagesPage$ = this.messagesPageSource.asObservable(); 

    public setPage(page: number) 
    { 
     this.messagesPageSource.next(page); 
    } 
} 

MainComponent :

import { Component, OnInit } from '@angular/core'; 
import { MessageService } from './messages.service'; 

@Component({ 
    selector: "main-component", 
    template: ` 
     <div (scroll)="onContainerScrollEvent($event)"> 
      <router-outlet></router-outlet> 
     </div> 
` 
}) 
export class MainComponent { 
    private pageNumber: number = 1; 
    constructor(private messageService: MessageService) { 
     messsageService.messagesPage$.subscribe(p => { }); 
    } 

    onContainerScroll(event: any) { 
     this.pageNumber += 1; 
     this.messageService.setPage(this.pageNumber); 
    } 
} 

messagesComponent

을

Answer 1

사용이 각 요리 책의 섹션 Parent and children communicate via a service에 설명 된대로 양방향 서비스 :

https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#bidirectional-service

당신이 당신의 부모와 자식 사이의 의사 소통을하는 데 사용할 메시지 서비스 만들기 구성 요소 및 기타 원하는 구성 요소가 포함됩니다.

위의 각형 요리 책에 대한 코드 예제를 건너 뛰는 것은 아주 좋은 예입니다.