离子搜索栏列表firebase已弃用

在我的Ionic应用程序中，我想使用搜索栏在我的firebase数据库中搜索用户，但是'list ' method in ' AngularFireDatabase'已随新版本更改 .

我在这里找到了新版角度firebase的帮助：https://github.com/angular/angularfire2/blob/HEAD/docs/rtdb/querying-lists.md

但它不起作用..

profile-search.component.ts

import { Component } from '@angular/core';
import { DataService } from '../../providers/data/data.service';
import { Profile } from "../../models/profile/profile.interface";
import { USER_LIST } from '../../mocks/profiles/profiles';

@Component({
  selector: 'app-profile-search',
  templateUrl: 'profile-search.component.html'
})
export class ProfileSearchComponent {

  query: string;

  profileList: Profile[];


  constructor(private data: DataService) {

  }

  // ! I have an error here ! //
  searchUser(query: string) { // I add '.valueChanges()' because the .subscribes is deprecated
    this.data.searchUser(query).valueChanges().subscribe(profiles => { 
      this.profileList = profiles; // The error is on the 'this.profileList'
    })
  }
}

data.service.ts

import { Injectable } from '@angular/core';
import { AngularFireDatabase, AngularFireObject } from "angularfire2/database";
import { Observable } from 'rxjs/Observable';
import { User } from "firebase/app";
import { Profile } from "../../models/profile/profile.interface";
import "rxjs/add/operator/take";

@Injectable()
export class DataService {

  profileObject: AngularFireObject<Profile>

  profileList: Observable<Profile>

  constructor(private database: AngularFireDatabase) {

  }

  getProfile(user: User) {
    this.profileObject = this.database.object(`/profiles/${user.uid}`);
    return this.profileObject;  
  } 

  // The function for search users
  searchUser(firstName: string) {
    const query = this.database.list('/profiles', ref => ref.orderByChild('firstName').equalTo(firstName))
    return query;
  }
}

profile-search.component.html

<ion-searchbar [(ngModel)]="query" (ionChange)="searchUser(query)"></ion-searchbar>

<ion-list *ngIf="profileList.length > 0">

  <ion-item *ngFor="let profile of profileList">
    <ion-avatar item-left>
      <img src="assets/img/avatar.png" alt="Avatar">
    </ion-avatar>
    <h2>{{ profile.firstName }} {{profile.lastName }}</h2>
  </ion-item>
</ion-list>

profiles.ts

import { Profile } from "../../models/profile/profile.interface";

const userList: Profile[] = [
    { firstName: 'Paul', lastName: 'Halliday', email: 'paul@paul.com', avatar: 'assets/img/avatar.png', dateOfBirth: new Date() },
    { firstName: 'John', lastName: 'Doe', email: 'john@doe.com', avatar: 'assets/img/avatar.png', dateOfBirth: new Date() },
    { firstName: 'Sarah', lastName: 'Conor', email: 'sarah@conor.com', avatar: 'assets/img/avatar.png', dateOfBirth: new Date() },
    { firstName: 'Mr', lastName: 'Dupont', email: 'mr@dupont.com', avatar: 'assets/img/avatar.png', dateOfBirth: new Date() }
];

export const USER_LIST = userList;

here a screen of my project

先感谢您 ！