Question

我正在使用Angular2和ionic，我有这样的组件：

class MyComponent implements OnInit, OnDestroy {
    ngOnInit() {
        console.log("init");
        socket.on("something", this.something.bind(this));
    }

    ngOnDestroy() {
        console.log("destroy");
        socket.remove("something", this.something.bind(this));
    }
}

要打开此页面，我会写this.nav.setRoot(MyComponent)。现在我的页面显示MyComponent，套接字正在侦听“某事”。

要刷新它，我再次写this.nav.setRoot(MyComponent)。现在我的页面显示MyComponet，并且套接字没有监听“某事”。

控制台输出是：

初始化

初始化

破坏

为什么它首先运行第二个组件的ngOnInit，然后只运行第一个组件的ngOnDestroy？
有没有办法首先调用destroy，然后是init？
我还有另一种方法可以处理我的插座吗？

Answer 1

据我了解，您无法真正控制，第二个组件的ngOnInit与第一个的ngOnDestroy之间应该首先发生什么。这些钩子，至少来自2个不同的组件，彼此不相关。钩子在同一组件上是否相互依赖。阅读this。

可能，这取决于目前更快触发的内容。

在这种情况下，您可以执行的操作是，在调用ngOnDestroy之前，您可以从this.nav.setRoot(MyComponent)移动代码。

此外，如果要求不适合此类代码，您可以尝试刷新需要刷新的特定类型的UI组件，而不是刷新整个组件，如this.nav.setRoot(MyComponent)。

您可以使用document.getElementByID('myDiv')类型的操作使用DOM刷新特定的UI组件。

希望这会有所帮助。如果没有，请提及具体细节。

Answer 2

显然，离子具有它自己的生命周期功能，正如here所述。

而不是ngOnInit使用ionViewDidLoad
而不是ngOnDestoy使用ionViewWillLeave

像魔术一样工作。

Angular2生命周期方法不按顺序执行

2 个答案: