AngularFire 4.0에서 anglefireobservable/anglefirelist ionic3 문제가 발생했습니다.

Question

현재 비디오 자습서를보고 있는데 InvalidPipeArgument 문제가 있습니다. 제발 나를 가이드로 ionic 및 angularfire 초보자로 새로운 해요.

.TS 코드에서 볼 수 있듯이

this is my HTML page 
    <ion-header> 
     <ion-navbar color="twitter"> 
     <ion-title> 
     <!--<span style="background-color:red">Hello</span>World--> 
     <span color="twitter">Job Categories</span> 
     </ion-title> 
     </ion-navbar> 
    </ion-header> 
    <ion-content class="card-background-page"> 
    <div> 
     <ion-row> 
     <ion-col> 
     <ion-input type="text" [(ngModel)]="newItem" placeholder="New Shopping item"></ion-input> 
     </ion-col> 
     <ion-col> 
     <button ion-button (click)="addJob()"> Add! </button> 
     </ion-col> 
     </ion-row> 
     <ion-list> 
     <ion-item-sliding *ngFor="let item of shoppingItems | async"> 
     <ion-item> 
     {{item.value}} 
     </ion-item> 
     </ion-item-sliding> 
     </ion-list> 
    </div> 
    </ion-content> 

and this is my ts page: 

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { JobListingPage } from '../job-listing/job-listing'; 
import { FirebaseServiceProvider } from './../../providers/firebase-service/firebase-service'; 
import { FirebaseListObservable } from 'angularfire2/database'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 
    shoppingItems: FirebaseListObservable<any[]>; 
    newItem = ''; 

    constructor(public navCtrl: NavController, public firebaseService: FirebaseServiceProvider) { 
     this.shoppingItems = this.firebaseService.getJobCategories(); 
    } 

    addJob() { 
     this.firebaseService.addJob(this.newItem); 
    } 
} 

and this is my firebase-service.ts page 
import { AngularFireDatabase } from 'angularfire2/database'; 
import { Injectable } from '@angular/core'; 
//import { Http } from '@angular/http'; 
//import 'rxjs/add/operator/map'; 

/* 
    Generated class for the FirebaseServiceProvider provider. 

    See https://angular.io/guide/dependency-injection for more info on providers 
    and Angular DI. 
*/ 
@Injectable() 
export class FirebaseServiceProvider { 

    /*constructor(public http: Http) { 
    console.log('Hello FirebaseServiceProvider Provider'); 
    }*/ 

    constructor(public afd: AngularFireDatabase) { 
    } 

    getJobCategories() { 
     console.log("hi"); 
     console.log(this.afd.list('/jobs/')); 
     return this.afd.list('/jobs/'); 
    } 

    addJob(name) { 
     this.afd.list('/jobs/').push(name); 
    } 
} 

, getJobCategories 콘솔을 인쇄 않지만 유형으로 반환 할 수 없습니다 비동기와 uncompatible/다른가?

Answer 1

이 시도 :

return this.afd.list('/jobs/').valueChanges()