角度 + 离子 2 + ngrx/存储 - 取消订阅不起作用

Question

我有一个实现了ngrx/store的ionic2应用程序，我遇到了一个奇怪的行为。

nav:Subscription;
ngOnInit(): void {
    this.nav = this.store.select(fromRoot.getLoginState).subscribe(res => {
        if(res){
            this.navCtrl.setRoot(TabsPage);
        }
    })
}
ngOnDestroy(): void {
    this.nav.unsubscribe()
}

store.select(fromRoot.getLoginState( 返回一个布尔值，如果这是真的，我想在 Ionic 2 中将 TabsPage 设置为根。显然，我只希望它发生一次，所以我在onDestroy生命周期钩子中取消订阅。

但是取消订阅似乎不起作用，每次我得到状态更改时，它都会将视图设置回 Tabspage(因此订阅仍然会触发(

有什么想法吗？

干杯

Answer 1

您应该在订阅中取消订阅它

this.nav = this.store.select(fromRoot.getLoginState).subscribe(res => {
        if(res){
            this.navCtrl.setRoot(TabsPage);
        }
        //condition to check the required data is available 
         this.nav.unsubscribe();
}

Answer 2

ngrx使用rxjs Observable s，当您不在乎在收到结果之前取消订阅时，可以轻松地将其转换为Promise s以接收这样的单个值。

如果您真的只需要一个值并且不会监视存储的登录状态更新，那么Observable.toPromise比弄乱订阅更容易，并且恕我直言，代码的意图更清晰。

以下是使用 toPromise 的示例：

// notice no assignment here, since no need to unsubscribe
this.store.select(fromRoot.getLoginState).toPromise()
    .then(res => res && this.navCtrl.setRoot(TabsPage));