Angularfire2破坏/取消订阅Observable

时间:2018-02-25 18:24:31

标签: angular ionic-framework observable angularfire2

在我的Ionic应用程序中,我需要销毁/取消订阅Observable。在视图中我使用异步管道。我知道取消订阅不是Observable的功能,但我需要一种方法来做到这一点。我只想在用户注销或页面离开时Observable销毁或取消订阅。 以下是我的代码。

cartRef: AngularFireList<any>;
cart: Observable<any>;

constructor(public db: AngularFireDatabase) {}

ionViewDidLoad() {

    this.cartRef = this.db.list(`/cart/123`);
    this.cart = this.cartRef
    .snapshotChanges()
    .map(changes =>
        changes.map(c => ({
            key: c.payload.key,
            ...c.payload.val()
        }))
    );
}

现在,当用户离开页面时,我想取消该Observable

ionViewCanLeave() {
   // below line does not work because it is not valid subscriber
   // this.cart.unsubscribe();
}

现在当我从Firebase注销用户时,Observable会在注销后自动运行并通过我发送错误

Uncaught (in promise): Error: permission_denied at /cart/123: Client doesn't have permission to access the desired data.

这就是为什么我想要取消Observable的方法。

2 个答案:

答案 0 :(得分:0)

我认为你需要尝试takeUntill

首先声明一些主题

private ngUnsubscribe: Subject<any> = new Subject();

在可观察链中它将是这样的

.takeUntill(this.ngUnsubscribe)

并且在你OnDestroy生命钩子中你需要创建这个函数

ngOnDestroy() {
   this.initUnsubscribe();
}

和取消订阅的功能

 initUnsubscribe(): void {
    this.ngUnsubscribe.next();
    this.ngUnsubscribe.complete();
  }

适合我,但你最好使用异步管道,让Angular做所有的魔法。

答案 1 :(得分:0)

你可以这样做:

 <ul id=show_inline_users>
      <li class=opt title='Jenna'>Jenna</li>
        <li class=opt title='Jeremy'>Jeremy</li>
           <li class=opt title='Jean'>Jean</li>
                <li class=opt title='Jelly'>Jelly</li>
     </ul>

然后你可以将它添加到你的observable:

private destroy$ = new Subject<void>();

ngOnDestroy() {
  this.destroy$.next();
  this.destroy$.complete();
}