使用变量作为角度的火力参考答案

【问题标题】：Using a variable as a firebase reference in angular使用变量作为角度的火力参考
【发布时间】：2019-02-26 05:38:04
【问题描述】：

我想让一个字符串变量包含一个值，然后用它来设置我的 firebase 数据库的引用路径。前任。 uid 将存储路由 paramMap 中的变量，然后在路径中使用以从数据库中获取数据。我在下面尝试过，但显然没有用。

export class HistoryComponent implements OnInit {
    snaps: Observable<any[]>;
    uid: string;

    constructor(db: AngularFireDatabase
    private ngZone: NgZone, private afs: AngularFirestore, private route: 
    ActivatedRoute){

    this.snaps = db.list('snapity-tests/12-02-19/'+ $(uid)).valueChanges();   
    }


    ngOnInit() {    
        this.route.paramMap
        .subscribe(params => {
            this.uid = params.get('uid');
            console.log(this.uid)
    })
}}

【问题讨论】：

尝试在 ngOnInit() 函数中将数据库订阅作为嵌套订阅移动，但这不是最佳实践
this.snaps = db.list(`snapity-tests/12-02-19/${this.uid}`).valueChanges(); inside subscribe() 至少在this.uid = params.get('uid'); 行之后，并将逻辑移出构造函数。您还可以考虑运算符 switchMap 和 tap 使其更“RxJS”。

标签： javascript angular firebase-realtime-database angularfire2

【解决方案1】：

您需要将构造函数内的代码移动到ngOnInit 生命周期钩子，因为类构造函数总是在onInit 钩子之前调用。

如Angular Docs中所述：

在 Angular 初始化指令的所有数据绑定属性后调用的生命周期钩子

所以，你只需要订阅路由参数，然后，当你有你想要的值时，你就可以使用它了：

export class HistoryComponent implements OnInit {
  snaps: Observable<any[]>;
  uid: string;

  constructor(
    private db: AngularFireDatabase,
    private ngZone: NgZone,
    private afs: AngularFirestore,
    private route: ActivatedRoute
  ){ }

  ngOnInit() {    
    this.route.paramMap
      .subscribe(params => {
        this.uid = params.get('uid');
        this.snaps = db.list('snapity-tests/12-02-19/'+ this.uid).valueChanges();   
  })
}}

【讨论】：