2017-10-08 145 views
0

我目前正在尝试使用谷歌浏览器firebase构建事端,并且遇到了问题。看来,这个代码片段在Firebase数据库中检索ID

export class FirebaseService { 
    items: Observable<Item[]>; 

    constructor(private db: AngularFireDatabase){ 

    } 

    getBusinesses(){ 
     this.businesses = this.db.list('/items').valueChanges() as Observable<Item[]> 
     return this.items; 
    } 

} 

用来给您$键作为对象在数据库中的关键对象(至少这就是它的教程中,我读做)

的问题是,$ key是未定义的,我想知道,我如何获得list-method来返回包含密钥的对象。一直尝试了一段时间,但我无法真正找到错误。如果有人知道答案会很高兴。

[编辑]

https://github.com/angular/angularfire2/blob/master/docs/version-5-upgrade.md 这使我有点接近的解决方案。看来,angularfire2在版本5.0.0中看到了一些重大变化。但是由于我仍然在学习,所以我不能真正将它集成到我的代码中。目前,它看起来像这样

firebase.service.ts

import { Injectable } from '@angular/core'; 
import { AngularFireModule } from 'angularfire2'; 
import { AngularFireDatabase, AngularFireDatabaseModule } from 'angularfire2/database'; 
import { FirebaseListObservable } from 'angularfire2/database-deprecated'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 
import {Business} from '../Business'; 
import {Category} from '../Category'; 

@Injectable() 
export class FirebaseService { 
    businesses : Observable<Business[]>; 
    categories : Observable<Category[]>; 

    constructor(private db: AngularFireDatabase){ 

    } 

    getBusinesses(){ 
     this.businesses = this.db.object('/businesses').snapshotChanges().map(action => { 
      console.log('ACTION:'); 
      console.log(action); 
      const $key = action.payload.key; 
      const data = {$key, ...action.payload.val()}; 
      return data; 
     }) as Observable<Business[]>; 
     return this.businesses; 
    } 
} 

和app.component.ts

import { Component, OnInit } from '@angular/core'; 
import { AngularFireDatabase } from 'angularfire2/database'; 
import { Observable } from 'rxjs/Observable'; 
import { FirebaseService } from './services/firebase.service'; 
import { Business } from './Business'; 
import { Category } from './Category'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    title = 'app'; 
    items: Observable<any[]>; 
    businesses: Business[]; 
    categories: Category[]; 
    appState: string; 
    activeKey: string; 

    constructor(private _firebaseService: FirebaseService){ 

    } 

    ngOnInit(){ 
     this._firebaseService.getBusinesses().subscribe(businesses => { 
      console.log('Businesses:'); 
      console.log(businesses); 
      this.businesses = businesses; 
     }); 
    } 


} 

现在我的结果并不像我希望它是。基本上我回来的是

{ 
    0: { 
     Key01: "xyz", 
     Key02: "yyy" 
    }, 
    1: { 
     Key11: "zyx", 
     Key12: "zzz" 
    }, 
    $key: "businesses" 
} 

我会继续尝试。也许你知道我做错了什么。感谢您的帮助迄今

[/编辑]

+0

用.object()替换.list(),你会得到对象(以及与它的关键) – Wandrille

+0

不幸的是,没有工作。仍然得到没有密钥的对象 – Chris

回答

0

您需要申报的物品作为FirebaseListObservable<Item[]>并做getBusinesses()调用象下面这样:

this.items= this.af.list('/items') as FirebaseListObservable<Item[]>; 

希望这会帮助你$ key值。

+0

不幸的是,我无法导入FirebaseListObservable。它既没有在'angularfire2'也没有在'agularfire2/database'中找到。我正在使用版本5.0.0。我应该使用另一个吗? 它看起来像我现在应该使用rxjs/Observable作为https://stackoverflow.com/questions/43799052/angularfire-and-firebaselistobservable-has-no-exported-member-angularfire2-using我不赞成FirebasListObservable。 :/ – Chris

+0

好吧,我'再往前一步。 https://github.com/angular/angularfire2/blob/master/docs/version-5-upgrade.md 这给了更多的清晰度,但我仍然无法弄清楚如何改变我的服务和应用程序。零件。我将编辑我的问题,因为在这里很难描述它 – Chris