Question

我在Angular 8组件中有以下声明：

@ViewChildren(SelectComponent) selects: QueryList<SelectComponent>;

其中SelectComponent在* ngFor中被声明N次。

要在有任何编辑时循环遍历selects数组，请订阅更改：

this.selects.changes.subscribe(list => {
            list.forEach(item => {
                 alert('in forEach');
                // do something
            });
        });

该循环工作正常，但是问题在于，当我关闭并重新打开主要组件时，由于警报显示了几次，因此无法清除先前的selects外观。

关闭组件后如何清除/取消订阅？

Answer 1

通过取消订阅OnDestroy挂钩来清除其他所有订阅的方式：

<room id="1" beds="1" windows="0"></room>

Answer 2

从内存中，您可以将订阅存储在组件内部的变量中

this.mySubscription = this.selects.changes.subscribe(list => {
            list.forEach(item => {
                 alert('in forEach');
                // do something
            });
        });

，然后在组件生命周期的ngOnDestroy部分内退订

public ngOnDestroy(): void {
    this.mySubscription.unsubscribe();
}

Answer 3

尝试将NgOnDestroy方法添加到您的组件-https://angular.io/api/core/OnDestroy添加后，该操作应在重新加载时清除以前的所有订阅。

销毁时清除ViewChildren订阅

3 个答案: