如果你使用角,那么你使用RxJs。我教的时候我得到的一个常见问题角度是:我应该从所有这些可见退订吗?如果有,何时何地?

这篇文章将回答这些问题。

什么时候取消订阅?

网上有很多争论如何退订,但绝对是一个共识,当我们应该取消订阅。简短的回答是ngOnDestroy。

为什么ngOnDestroy吗?因为调用这个方法总是当一个组件从DOM中删除,不管它是如何移除。因此,它是唯一的方式是100%确定你无论如何正确退订。

这里是一个快速的代码示例来说明:

从“rxjs”进口{订阅};…潜艇:订阅;构造函数(){
这一点。潜艇=someObservable。订阅(…);
}/ * *
*生命周期钩时所有订阅取消订阅组件被销毁
* /
ngOnDestroy():{无效
this.subs。退订();
}

我应该总是退订吗?

是的。即使你使用一个可观测的完成,如HttpClient请求,你应该取消订阅。

为什么?因为你的组件可以从DOM中删除订阅前完成。比如说,你让一个HTTP请求,需要一些时间和用户单击导航远离该组件而请求仍在运行。恭喜,你现在有一个幽灵订阅在内存泄漏可能会因为这可以观察到的是永远不会没订阅。

所以你应该总是退订ngOnDestroy。

是不是很多繁琐的工作吗?

它可以如果你没有使用正确的工具。我推荐的第一件事就是将你所有的订阅存储在一个数组,所以它是容易循环,退订后。

我一直在使用沃德贝尔的SubSink实现解决这个问题。这是这样一个简单的类,存储你所有的订阅和退订它们提供一种方法:

出口类SomeComponent实现OnDestroy {
私人潜艇=新SubSink();

…
/ /简单语法
this.subs。水槽=可见美元.subscribe (…);/ /同样的工作添加()
this.subs。添加(可见.subscribe美元(…));/ /也可以添加多个订阅
this.subs。添加(
可见美元.subscribe (……)
anotherObservable .subscribe美元(…)
);

…

/ /退订当组件死亡
ngOnDestroy(){
this.subs。退订();
}
}

我们可以做得更好吗?

当然,我们可以。第一个选项我建议如果你不想首先是不要订阅退订。这听起来很傻但使用异步管,可以自动订阅/数据/退订机制几乎没有代码:

<表mat-table(数据源)= " filteredEntries $|异步”>

在上面的例子中,filteredEntries美元在打印稿类是一个可观测的准备,但不订阅。我们让角都通过异步管。

但异步管并不适合我,因为我想做一些与我的打印稿代码中的数据

这不是一个有效的理由不使用异步管,因为你仍然可以注册一些副作用代码使用利用接线员:

filteredEntries美元:可见<一> = someObservable .pipe美元(
利用(数据= >/ /做一些与你的数据)
);

这样我们不是在打印稿订阅,但我们仍然可以做一些当数据流经管道(双关语)。

如果我真的不能使用异步,还想写更少的代码吗?

这是我今天最后一个技巧。就像你,我累了ngOnDestroy总是做同样的事情所以我写它所有的适配器类:

从“@angular进口{OnDestroy} /核心”;
进口{SubSink}”。/ sub-sink ';/ * *
*一个时自动取消订阅所有可见的类
*对象被销毁
* /
出口类UnsubscribeOnDestroyAdapter实现了OnDestroy{/ * * * /订阅水槽对象存储所有的订阅
潜艇= newSubSink();/ * *
*生命周期的钩取消订阅所有订阅
*当组件/对象被销毁
* /
ngOnDestroy():{无效
this.subs.unsubscribe ();
}

现在我所有的组件/服务/指令/订阅延伸的管道UnsubscribeOnDestroyAdapter。我没有实现ngOnDestroy无处不在,它是做一次的适配器。

我也使用SubSink,宣称只有一次。现在我所要做的是这样的:在我的组件

从“@angular进口{组件,OnInit} /核心”;
从“. . / unsubscribe-on-destroy-adapter”进口{UnsubscribeOnDestroyAdapter};@ component ({…})
MyComponent出口类添加扩展UnsubscribeOnDestroyAdapter{构造函数(){
超级();
this.subs。水槽=someObservable .subscribe美元(…);
}
}

并完成了!使用上面的技巧,我做了我的订阅管理几乎无痛角应用程序中。

看到这样的代码的示例,请随意看看https://stackblitz.com/edit/unsubscribe-on-destroy?file=src%2Fapp%2Funsubscribe-on-destroy-adapter.ts

我的名字是betway必威滚球。我是谷歌开发者角度方面的专家,以及成立顾问和教练角训练我帮助开发团队学习,成为精通角。

和角需要帮助吗?让我们安排一些时间来说话。

如果你喜欢这篇文章,请为它鼓掌或分享它。我总是感激你的帮助。