Angular2 生命周期方法无序执行

Question

我正在使用带有ionic的Angular2，并且我有这种组件：

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第一个组件？
• 有没有办法先调用销毁，然后调用初始化？
• 有没有其他方法应该处理我的插座？

Answer 1

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

也许，这取决于目前触发速度更快的内容。

在这种情况下，您可以做的是，您可以在调用 this.nav.setRoot(MyComponent) 之前将代码从 ngOnDestroy 中移出。

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

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

希望这有帮助。如果没有，请提及具体情况。

Answer 2

显然，Ionic有自己的生命周期功能，如此处所述。

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

像魔术一样工作。