来自动态加载组件的父对象的angular2 typescript调用方法

Question

我试图从动态加载的组件中调用父方法。我正在使用Angular cookbook https://angular.io/guide/dynamic-component-loader

中的动态组件加载器解决方案

我尝试完成的是从加载的组件中调用父类的deleteBanner方法。

我在加载的组件（HeroJobAdComponent和HeroProfileComponent）上添加了一个eventEmitter，并尝试捕获AdBannerComponent中的事件（deleteBanner）并在AdBannerComponent中调用deleteBanneronParent上的本地方法。

加载组件中的eventEmitter：

export class HeroProfileComponent implements AdComponent {
  @Input() data: any;
  @Output() deleteBanner: EventEmitter<string> = new 
  EventEmitter<string>();

  removeBanner() {
    console.log('removeBanner on HeroProfileComponent invoked');
    this.deleteBanner.emit(null);
  }
}

并在父母中捕捉事件：

<div ad-host (deleteBanner)="deleteBanneronParent()"></div>

调用已加载组件的本地方法，但由于某种原因，它不会传播到父组件。知道我在这里缺少什么吗？

https://plnkr.co/edit/NzdkaLSEiAmlNnRyN5BW