运行时错误=对象不是函数

Question

我正在开发Ionic的第一个应用程序，并希望在home.html上显示firebase数据，但是当我启动服务时，在浏览器中显示此消息：

object(...) is not a function

我在home.ts创建此代码：

import { Component } from '@angular/core';
import { NavController, IonicPage } from 'ionic-angular'; 
import { ShoppingListService } from '../../services/shopping-list/shopping-list.service';
import { AjaxObservable } from 'rxjs/observable/dom/AjaxObservable';
import { Observable } from 'rxjs/Observable';
import { Item } from '../../models/item/item.model';

@IonicPage()
@Component({
   selector: 'page-home',
   templateUrl: 'home.html'
})
export class HomePage { 

  shoppingList$ : Observable <Item[]>;

  constructor(public navCtrl: NavController, private shopping:ShoppingListService) {
this.shoppingList$ = this.shopping
.getShoppingList() //pega a lista do banco de dados
.snapshotChanges() //chave e valor das infos do bd
.map(changes => {
    return changes.map(c => ({
      key: c.payload.key, 
      ...c.payload.val(),
    }));
  });
}



}

在此之后，我创建了home.html：

<ion-content padding>
  <ion-list>
    <ion-list-header>
  Items
</ion-list-header>
<ion-item *ngFor="let item of shoppingList$ | async">
  {{item.nomecontratante}}

</ion-item>
</ion-list>

</ion-content>

谢谢你的帮助！