取消订阅一系列订阅 [英] Unsubscribing an array of subscriptions

问题描述

在Angular应用中，我通过将订阅全部推送到数组中，然后循环遍历并在ngOnDestroy期间取消订阅来管理我的订阅.

In an Angular app, I'm managing my subscriptions by pushing them all into an array, then looping through it and unsubscribing during ngOnDestroy.

private subscriptions: Subscription[] = []
this.subscriptions.push(someObservable.subscribe(foo => bar))

我的问题是我还没有找到一种足够干净的方法来处理取消订阅.理想的方法是简单的

My problem is that I haven't found a sufficiently clean way to handle the unsubscription. The ideal way would be a simple

ngOnDestroy () {
    this.subscriptions.forEach(subscription => subscription.unsubscribe())
}

但这是行不通的.值得注意的是，注销后我仍然收到Firebase权限错误(有效"方法不会发生这种情况).有趣的是，如果我将它拉出一个单独的类，完全相同的方法会起作用:

but this doesn't work. Notably, I'm still receiving Firebase permission errors after logging out (which doesn't happen with the "working" methods). Interestingly, the exact same method does work if I pull it out into a separate class:

export class Utils {
    public static unsubscribeAll (subObject: {subscriptions: Subscription[]}) {
        subObject.subscriptions.forEach(subscription => subscription.unsubscribe())
    }
}

// ---------- back to the component

ngOnDestroy () {
    Utils.unsubscribeAll({subscriptions: this.subscriptions}) // no Firebase errors
}

但是我不太喜欢这种解决方案，主要是因为它仅在将数组包装在对象中以使其作为引用传递时才起作用.我发现的另一种工作方法是将其编写为for循环:

but I don't really like this solution, mostly because it only works if I wrap the array in an object so it passes as a reference. The other working method I found was to write it as a for loop:

ngOnDestroy () {
    /* tslint:disable */
    for (let i = 0; i < this.subscriptions.length; i++) {
        this.subscriptions[i].unsubscribe()
    }
    /* tslint:enable */
}

但是除了不必要的长度外，它还使TSLint抱怨，因为它认为我应该使用for-of循环(这不起作用)，因此我每次都必须添加多余的注释.

but aside from the unnecessary length, it also makes TSLint complain because it thinks I should be using a for-of loop instead (which doesn't work) so I have to throw in the extra comments every time.

当前，我将Utils选项用作最佳"解决方案，但我对此仍然不满意.有没有一种更干净的方法可以做到这一点?

Currently I'm using the Utils option as the "best" solution, but I'm still not happy with it. Is there a cleaner way to do this that I'm missing?

推荐答案

由于没有人愿意将答案发布为答案，所以我想我会这么做.

Since nobody wants to post their answer as an answer, I guess I'll do it.

如果仅使用数组将它们分组以进行大量取消订阅，则可以通过将它们合并到现有订阅中来完成相同的操作.对于我的设置，只需将空数组更改为空订阅，然后将push更改为add:

If you're only using the array to group them for mass unsubscribing, you can accomplish the same thing by merging them into an existing subscription. For my setup, just change the empty array to an empty subscription and change push to add:

private subscriptions = new Subscription()
this.subscriptions.add(someObservable.subscribe(foo => bar))

然后，当您想要全部取消订阅时，只需取消订阅容器订阅，它将处理所有内容.

Then, when you want to unsubscribe from them all, just unsubscribe from the container subscription and it will handle everything.

ngOnDestroy () {
    this.subscriptions.unsubscribe()
}

注意:您还可以在每个单独的订阅上使用takeUntil，但是我觉得这种方法更简单，并且对我正在做的事情更有意义.

Note: you can also use takeUntil on each individual subscription, but I feel like this method is simpler and makes more sense for what I'm doing.

这篇关于取消订阅一系列订阅的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！