Angular 2：加载嵌套组件正在破坏 ng2-toastr 的现有范围答案

【问题标题】：Angular 2 : Loading nested Component is destroying the existing scope of ng2-toastrAngular 2：加载嵌套组件正在破坏 ng2-toastr 的现有范围
【发布时间】：2017-02-22 08:28:18
【问题描述】：

我在我的页面中使用 ng2-toastr 并且工作正常，但是当我在页面中有嵌套组件时，现有的 ng2-toastr(ToastManager) 范围被破坏并且 toastr 不工作。

constructor(public toastr: ToastsManager,public vcr: ViewContainerRef) {
        this.toastr.setRootViewContainerRef(vcr);
}

在我调用时的方法中

this.toastr.warning('Its Warning','Alert');

它工作正常，但在我加载其他组件时在我的 html 中，即

<es-app></es-app>

我页面中的 toastr 不工作（没有错误）

有时我会得到：

尝试使用已破坏视图：detectChanges 错误：尝试使用已破坏视图：DetectChanges at ViewDestroyedError

【问题讨论】：

标签： angular toastr angular-toastr

【解决方案1】：

通过在 ngAfterViewInit 中初始化容器解决了这个问题

this.toastr.setRootViewContainerRef(vcr);

而不是构造函数放置在

ngAfterViewInit(){
this.toastr.setRootViewContainerRef(this.vcr);
}

因为嵌套组件正在加载和销毁页面实例，所以我们必须在加载所有组件之后加载，并且根据页面生命周期钩子在 ngAfterViewInit 中发生这种情况

【讨论】：