Angular 2 - 破坏子组件

Ale*_*der 9 typescript angular

我从Angular 2开始,我有一个子组件"ChildCmp"初始化,在我需要通过点击销毁组件之后,让我们说:

@Component({
selector: 'main-cmp',
templateUrl: './main-cmp.html',
directives: [ChildCmp]
})
class MainCmp {
    @ViewChild(ChildCmp)
    childCmp: ChildCmp;
    destroyChildClick(){
        this.childCmp.destroy();
    }
}
Run Code Online (Sandbox Code Playgroud)

但是前面的代码没有运行,destroy()是未定义的,异常是:

TypeError:this.childCmp.destroy不是函数

我已经阅读了这个线程并且使用了ViewContainerRef.createComponent(),使用它创建的组件是"ComponentRef"的实例,但是childCmp没有"ComponentRef"实现.

我如何实现或注入destroy方法?

谢谢大家!

Mur*_*sli 5

尝试这个

export class MainCmp {

   @ViewChild(ChildCmp) childRef: ChildCmp;

   destroyClick() {

      if (this.childRef) {
         this.childRef.destroy();
      }
   }
}
Run Code Online (Sandbox Code Playgroud)

  • 那没有道理。 (2认同)
  • 我刚刚将ngOnDestroy()重命名为destroyClick(),重要的是如何从组件代码中手动销毁它 (2认同)