在 Angular 中将数据发送到 firebase 数据库时出现错误答案

【问题标题】：I am getting error While sending data to the firebase Database in Angular在 Angular 中将数据发送到 firebase 数据库时出现错误
【发布时间】：2019-03-14 03:41:43
【问题描述】：

我正在开发基于 Angular-firebase 的聊天应用程序，

当我将数据发送到我的 Angular 服务文件 chat.service.ts 时出现错误
我把错误放在下面

ChatFormComponent.html:5 ERROR TypeError: queryFn is not a function 在 AngularFireDatabase.push../node_modules/angularfire2/database/database.js.AngularFireDatabase.list (database.js:18) 在 ChatService.push../src/app/services/chat.service.ts.ChatService.getMessages (chat.service.ts:39) 在 ChatService.push../src/app/services/chat.service.ts.ChatService.sendMessage (chat.service.ts:29)

我将发送数据到服务文件的组件的代码放在下面

.ts 文件

import { Component, OnInit } from '@angular/core';
import { ChatService } from '../services/chat.service';

@Component({
  selector: 'app-chat-form',
  templateUrl: './chat-form.component.html',
  styleUrls: ['./chat-form.component.css']
})
export class ChatFormComponent implements OnInit {

message: string;

  constructor( private _chat: ChatService) {}

  send() {
    console.log(this.message);
    this._chat.sendMessage(this.message);
    this.message = '';
  }
}

.html 文件

<input class="chatInput" [(ngModel)]="message"/>

<button class="chatButton"  (click)=send()>Send</button>

上述组件代码将数据发送到与firebase交互的服务

服务代码 ->

import { Injectable } from '@angular/core';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
import { AngularFireAuth } from 'angularfire2/auth';
import { Observable } from 'rxjs/Observable';
import { AuthService } from '../services/auth.service';
import * as firebase from 'firebase/app';

import { ChatMessage } from '../models/chat-message.model';

@Injectable()
export class ChatService {

  user: firebase.User;
  chatMessages: FirebaseListObservable<ChatMessage[]>;
  chatMessage: ChatMessage;
  userName: Observable<string>;

  constructor( private db: AngularFireDatabase , private afAuth: AngularFireAuth ) { }

getUser() {}

  sendMessage(msg: string) {
    const timestamp = this.getTimeStamp();
    const email =  'biky700@gmail.com';
    this.chatMessages = this.getMessages();
    this.chatMessages.push({
      message: msg,
      timeSent: timestamp,
      userName:  'Anurag Ranjan',
      email: email });
  }

  getMessages(): FirebaseListObservable<ChatMessage[]> {
    // query to create our message feed binding
    return this.db.list('messages', {
      query: {
        limitToLast: 25,
        orderByKey:  true
      }
    });
  }

  getTimeStamp(){}
 }
}

重要

在上面的服务代码中，您可以看到创建我们的消息提要绑定的部分代码，代码如下

getMessages(): FirebaseListObservable<ChatMessage[]> {
    return this.db.list('messages', {
      query: {
        limitToLast: 25,
        orderByKey:  true
      }
    });
  }

当我将鼠标悬停在上面时，我会收到下面的消息

[ts] 类型参数 '{ query: { limitToLast: number; orderByKey：布尔值； }; }' 不可分配给“QueryFn”类型的参数。
对象字面量只能指定已知属性，而“查询”不存在于“QueryFn”类型中。 (属性) orderByKey: boolean

【问题讨论】：

标签： angular firebase firebase-realtime-database angularfire2

【解决方案1】：

好像有人和你有同样的问题，这个帖子已经回答了：Stackoverflow。

请试试这个：

getMessages(): Observable<ChatMessage[]> {
return this.db.list('/messages', ref => {
  ref.limitTolast(25).orderByKey(true)
});

}

【讨论】：

【解决方案2】：

你的getMessage函数应该是这样的。

getMessages(): Observable<ChatMessage[]> {
    return this.db.list('/messages', ref => 
      let q = ref.limitTolast(25).orderByKey(true);
      return q;
    );
  }

有关详细信息，请参阅此内容。 https://github.com/angular/angularfire2/blob/master/docs/rtdb/querying-lists.md

【讨论】：