[Angular]如何将FirebaseListObservable切换为AngularFireList?

时间:2018-10-13 18:37:36

标签: angular typescript firebase

因此,我正在研究如何构建支持Firebase的聊天网站。 我选了一个我认为不错的youtube教程。

但是由于Angular的最新版本将模块FirebaseListObservable替换为新模块AngularFireList。

这是本教程的git repo, https://github.com/wesdoyle/base-chat/blob/master/src/app/services/chat.service.ts

我将其切换如下,

import { Injectable } from '@angular/core';
import { AngularFireDatabase, AngularFireList } 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({
  providedIn: 'root'
})
export class ChatService {
  user: any;
  chatMessages: AngularFireList < ChatMessage[] > ;
  chatMessage: ChatMessage;
  userName: Observable < string > ;

  constructor(
    private db: AngularFireDatabase,
    private dfAuth: AngularFireAuth,
  ) {
    //this.dfAuth.authState.subscribe(auth =>{
    //  if(auth !== undefined && auth !== null){
    //    this.user = auth;
    //  }
    //});
  }

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

  sendMessage(msg: string) {
    const timestamp = this.getTimeStamp();
    // const email = this.user.email;
    const email = 'test@example.com';
    this.chatMessages = this.getMessages();
    this.chatMessages.push({
      message: '',
      timeSent: timestamp,
      // userName: this.userName,
      userName: 'test-user',
      email: ''
    })
    console.log('Called sendMessage()!!')
  };

  getTimeStamp() {
    const now = new Date();
    const date = now.getUTCFullYear() + '/' +
      (now.getUTCMonth() + 1) + '/' +
      now.getUTCDate();
    const time = now.getUTCHours() + ':' +
      now.getUTCMinutes() + ':' +
      now.getUTCSeconds();

    return (date + ' ' + time)
  }
}

但是出现了这样的错误:

ERROR in src/app/services/chat.service.ts(31,46): error TS2304: Cannot find name 't'.
src/app/services/chat.service.ts(31,46): error TS2538: Type 'any' cannot be used as an index type.
src/app/services/chat.service.ts(33,5): error TS2322: Type 'Observable<{}[]>' is not assignable to type 'AngularFireList<any>'.
  Property 'query' is missing in type 'Observable<{}[]>'.
src/app/services/chat.service.ts(33,45): error TS2554: Expected 0 arguments, but got 1.
src/app/services/chat.service.ts(44,7): error TS2345: Argument of type '{ message: string; timeSent: string; userName: string; email: string; }' is not assignable to parameter of type 'ChatMessage[]'.
  Object literal may only specify known properties, and 'message' does not exist in type 'Message[]'.

有人可以帮忙吗?

1 个答案:

答案 0 :(得分:2)

Tienes el error aqui

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