如何取消订阅 AngularFire db observation/subscription?

How to unsubscribe from AngularFire db observation/subscription?

我想退订对我的 Firebase 数据库中某个位置的订阅。我正在使用 Ionic 3 和 AngularFire2。

但是我不知道要订阅哪种数据类型,因为目前它是 FirebaseObjectObservable<any>,我无法取消订阅。

在没有取消订阅的情况下,每当我尝试注销时(当我调用 afAuth.auth.signOut() 时),我都会遇到以下错误:

Runtime Error**
permission_denied at /parents/<auth.uid>: Client doesn't have permission to access the desired data.

Stack**
Error: permission_denied at /parents/<auth.uid>: Client doesn't have permission to access the desired data.
    at G (http://localhost:8100/build/main.js:36366:36)
    at Object.G (http://localhost:8100/build/main.js:36370:86)
    at Lg (http://localhost:8100/build/main.js:36342:98)
    at Ag.g.wd (http://localhost:8100/build/main.js:36335:310)
    at og.wd (http://localhost:8100/build/main.js:36325:364)
    at Yf.Xf (http://localhost:8100/build/main.js:36323:281)
    at ag (http://localhost:8100/build/main.js:36307:464)
    at WebSocket.Ia.onmessage (http://localhost:8100/build/main.js:36306:245)
    at WebSocket.o [as __zone_symbol___onmessage] (http://localhost:8100/build/polyfills.js:2:24340)
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:9967)

因为它仍在尝试读取它现在无法访问的内容,因为我未通过身份验证。

我的 Firebase 规则:

{
  "rules": {
    ".read": "auth != null",
    ".write": "auth != null"
  }
}

我的home.ts文件:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { AngularFireDatabase, FirebaseObjectObservable, FirebaseListObservable } from 'angularfire2/database';
import { AngularFireAuthModule, AngularFireAuth } from 'angularfire2/auth';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  //What datatype should I make this?
  profileResult: FirebaseObjectObservable<any>;

  constructor( public navCtrl: NavController,
               private db: AngularFireDatabase,
               private afAuth: AngularFireAuth ) {


  }

  ngOnInit() {
    //Get authentication state
    this.afAuth.authState.subscribe(
        (auth) => {

          //if authenticated, get profile information for db and display using profileResult
          if (auth != null) {
            this.db.object('/parents/' + auth.uid).subscribe(profileResult => {
              this.profileResult = profileResult;
              console.log(profileResult);
            });
          }
      });
  }

  /* What I would like to do, but can't unsubscribe from FirebaseObjectObservable
  ngOnDestroy() {
    this.profileResult.unsubscribe();
  } 
  */

  //calling this results in my error
  signOut() {
    this.afAuth.auth.signOut();
  }

}

我的home.html文件:

<ion-header>
  <ion-navbar>
    <ion-title>
      My Awesome App
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

{{ profileResult?.firstName }}<br />
{{ profileResult?.lastName }}<br />
{{ profileResult?.youngestChildAge }}<br />
{{ profileResult?.interests }}<br />
{{ profileResult?.facebookUrl }}<br />
<button full ion-button (click)="signOut()">Sign Out</button>

</ion-content>

我可以将我的 profileResult: FirebaseObjectObservable<any>; 更改为什么以便既可以捕获数据又可以取消订阅?

您要退订吗?

mySubscription : any;


mySubscription = this.db.object('/parents/' + auth.uid).subscribe(profileResult => {
    this.profileResult = profileResult;
    console.log(profileResult);

});


mySubscription.unsubscribe();

在您的情况下,您可以使用 first 运算符

    import 'rxjs/add/operator/first';
    this.db.object('/parents/' + auth.uid).first().subscribe(profileResult => {
    this.profileResult = profileResult;
    console.log(profileResult);

});