我在使用 Firebase 和 Angular 时遇到错误

Question

我正在尝试从 angularfire2/database 导入 FirebaseListObservable

import { FirebaseListObservable } from 'angularfire2/database';

我在哪里得到错误

[ts] Module '"/Users/user/Projects/Angular/Old/A4/chat-app/node_modules/angularfire2/database/index"'

没有导出的成员“FirebaseListObservable”。

我正在输入我的应用程序的 pakage.json 文件的全部详细信息

{
  "name": "chat-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.0.3",
    "@angular/common": "^6.0.3",
    "@angular/compiler": "^6.0.3",
    "@angular/core": "^6.0.3",
    "@angular/forms": "^6.0.3",
    "@angular/http": "^6.0.3",
    "@angular/platform-browser": "^6.0.3",
    "@angular/platform-browser-dynamic": "^6.0.3",
    "@angular/router": "^6.0.3",
    "angular-firebase": "^1.1.4",
    "angularfire2": "^5.0.2",
    "core-js": "^2.5.4",
    "firebase": "^5.5.3",
    "rxjs": "^6.0.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.8",
    "@angular/cli": "^6.2.4",
    "@angular/compiler-cli": "^6.0.3",
    "@angular/language-service": "^6.0.3",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.3.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "~2.7.2"
  }
}

我正在将 FirebaseListObservable 导入到我的服务文件中。我还放了服务文件的详细信息

chat.service.ts

import { Injectable } from '@angular/core';
import { AngularFireDatabase } from 'angularfire2/database';
import { FirebaseListObservable } from 'angularfire2/database';
import { AngularFireAuth } from 'angularfire2/auth';
import { Observable } from 'rxjs';
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() {
  const userId = this.user.uid;
  const path = `/users/${userId}`;
  return this.db.object(path);
}

  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() {
    const now = new Date();
    const date = now.getUTCFullYear() + '/' +
                 (now.getUTCMonth() + 1) + '/' +
                 now.getUTCDate();
    const time = now.getUTCHours() + ':' +
                 now.getUTCMinutes() + ':' +
                 now.getUTCSeconds();

    return (date + ' ' + time);
  }



 }
}

我在上面提到的 chat.service.ts 代码中还遇到了另外两个错误

第一个错误

src/app/services/chat.service.ts(63,1) 中的错误：错误 TS1128： 需要声明或声明。

第二个错误

chat.service.ts 文件中的一些代码 -:

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

下面给出的一些代码带有红线，当我将鼠标悬停在它们上面时会显示消息

类型参数'{查询：{limitToLast：数字； orderByKey：布尔值； }; }' 不可分配给“QueryFn”类型的参数。目的 文字只能指定已知属性，并且“查询”不存在 在类型“QueryFn”中。

query: {
            limitToLast: 25,
            orderByKey:  true
          }

错误 3

我在顶部提到的导入 FirebaseListObservable 的问题

Answer 1

从 AngularFire 2.x 及更高版本开始，FirebaseObjectObservable 现在称为 AngularFireObject。

示例：

import { AngularFireDatabase, AngularFireObject } from 'angularfire2/database';