我可以将 .then() 与 firebaseListObservable 一起使用，即 this.items = query 和 .then()答案

【问题标题】：Can I use .then() with firebaseListObservable i.e this.items = query and .then()我可以将 .then() 与 firebaseListObservable 一起使用，即 this.items = query 和 .then()
【发布时间】：2017-06-20 07:44:09
【问题描述】：

我想在 this.items 中加载所有消息后执行向下滚动的任务我正在使用 angularfire2

items: FirebaseListObservable<any[]>;

                this.items = this.af.database.list('/conversations', {
                  query: {
                    orderByChild: 'chatKey',
                    equalTo: prop + '-' + this.userId
                  }
                })

我想像下面这样使用，但它不起作用。

items: FirebaseListObservable<any[]>;

                this.items = this.af.database.list('/conversations', {
                  query: {
                    orderByChild: 'chatKey',
                    equalTo: prop + '-' + this.userId
                  }
                }).then(()=>{
                      this.scrollToBottom();
                    })

this.scrollTobottom 代码在下方，适用于其他地方

  scrollToBottom(time?) {
    setTimeout((data) => {
      var element = document.getElementById('123');
      element.scrollTop = element.scrollHeight - element.clientHeight;
      console.log("element", element);
    }, time ? time : 4000);

【问题讨论】：

标签： javascript angular firebase firebase-realtime-database angularfire2

【解决方案1】：

因为它是一个 Observable Object，你必须要么使用

this.items = this.af.database.list('/conversations', {
    query: {
        orderByChild: 'chatKey',
        equalTo: prop + '-' + this.userId
    }
}).subscribe(data => {/* do things */}, error => {/* do error things */})

或者

this.items = this.af.database.list('/conversations', {
    query: {
        orderByChild: 'chatKey',
        equalTo: prop + '-' + this.userId
    }
})
.toPromise()
.then(/* ... */)

【讨论】：

【解决方案2】：

我通常使用的方式如下：

this.items = this.af.database.list('/conversations', {
    query: {
        orderByChild: 'chatKey',
        equalTo: prop + '-' + this.userId
    }
})
.first().toPromise()
.then(response => {
  //code here
})
.catch(error => { //error code here });

当然，不要忘记导入相关的库：（在您的组件\服务中）

import 'rxjs/add/operator/first';
import 'rxjs/Rx' ;
import 'rxjs/add/operator/toPromise';

【讨论】：

【解决方案3】：

简单。只需将您的代码更正为...

items: FirebaseListObservable<any[]>;

           let thisChatKey = prop + '-' + this.userId;

            this.items = this.af.database.list('/conversations', {
              query: {
                orderByChild: 'chatKey',
                equalTo: thisChatKey 
              }
            }).then(()=>{
                  this.scrollToBottom();
                })

【讨论】：