Angular2 - 组件

Question

app component.ts

import { Component,Input } from '@angular/core';

    @Component({
      selector: 'app-root',
      templateUrl: `
      <app-navigation></app-navigation>
      <router-outlet></router-outlet>`,
    })
    export class AppComponent {


      constructor( ) {
      }



    }

然后这个组件（）通过路由动态加载以显示广告，所以我实际上并没有在组件旁边声明它，我理解如何使用事件发射器传递输入和输出..更多关于此结尾：

import { Component, OnInit, Output, EventEmitter } from '@angular/core';


@Component({
  selector: 'app-ad-page',
  template: `
            <a (notify)="onNotify($event)">CLICKME</a>
  `
})

export class ListAdvertsComponent implements OnInit {

    @Output() notify: EventEmitter<string> = new EventEmitter<string>();

    onClick() {
      this.notify.emit('Click from parralel component');
    }

    constructor(  ) {

    }

    ngOnInit() {
    }

}

最后是app.component模板中声明的组件

  import { Component, OnInit, Input } from '@angular/core';
  import { AngularFire, AuthProviders, FirebaseListObservable } from 'angularfire2';
  import { Router } from '@angular/router';

  @Component({
    selector: 'app-navigation',
    template: `
          <header class="mast-head">
          </header>
    `,
  })
  export class NavigationComponent  {


    onNotify(message:string):void {
      alert(message);
    }

    constructor( ) {

    }



  }

所以我知道你可以通过用这样的东西来修改选择器来将值传递给app-navigation但是我实际上并没有将这个选择器放在模板中（当用户点击广告页面时它会动态加载到dom中那么如何才能将变量传递出去呢？非常坚持这一点，这不是我第一次在angular2中遇到它所以我很想听听人们如何做这种高级输入输出的东西