登出时如何摆脱“错误：permission_denied”？ （Angular-Firebase）

Question

嗨，我是Angular和Firebase的新手，对下一个问题感到困惑：我有两个组成部分授权区域（父组件）和文件夹（子组件）。授权区域有一个注销按钮，文件夹可以访问Firebase中的身份验证数据。问题是，当用户成功注销所有帐户时，会出现错误消息，而我试图摆脱该错误消息。父组件：授权区域

export class AuthorizedZoneComponent implements OnInit {
  
  constructor(public authService: AuthService) { }
  ngOnInit(): void {}

  //btn logout listener
  logout() { this.authService.logout(); }
}

   <app-folders></app-folders>
   <button id="logout"(click)="logout()">logout</button>`

子组件：文件夹

export interface Folder{
  id:string;
  name:string;
  key: string;
}

//This Component is to be used only by Authorized-zone!
export class FoldersComponent implements OnInit {

  private dbPath='/folders';//path to folders in realtime data base
  private folderArray: Array<Folder>=[];//Array for folders: each folder has id and name

  constructor(private router: Router, private route:ActivatedRoute, private db: AngularFireDatabase) { 
    
    this.db.list(this.dbPath).valueChanges().subscribe(data => {
      for( let i=0; i< data.length; i++){
        this.folderArray.push({id: data[i]["id"], name: data[i]["name"], key: data[i]["key"]});
      }
    })
  }

  ngOnInit(): void {}

  //returns array of folders
  getFolders(){ return this.folderArray;}

  //on folder click listerner
  onSelect(folder){}
}

<div (click)="onSelect(folder)" *ngFor="let folder of getFolders()> 
    <div class="folder" [id]="folder.id">{{folder.name}}</div> 
</div>

auth-service使用户能够登录和注销

事件的流程似乎运行良好。但是，当我按下注销按钮尽管该功能正常工作时，我仍收到控制台错误消息：

ERROR Error: permission_denied at /folders: Client doesn't have permission to access the desired data...

我注意到，如果我删除<app-folders></app-folders>，该错误将不会累积。

我在注销authorized-zone.component中曾尝试删除<app-folders></app-folders>：

//btn logout listener
  logout() {
    document.querySelector('app-folders').replaceWith("");
    this.authService.logout();
  }

这没有用，如果有人能够解释问题并提出解决方案，我将非常有责任

Answer 1

似乎我在文件夹组件中找到了使用ngOnDestroy的解决方法。

      private dbData;

      constructor(private router: Router, private route:ActivatedRoute, private db: AngularFireDatabase) { 

        this.dbData=this.db.list(this.dbPath).valueChanges()
        .subscribe(data => {//...


        })
      }


      //destroy firebaseData before logging out
      ngOnDestroy(){
        this.dbData.unsubscribe();
      }