2016-11-14 122 views
0


在我的組件中,我從服務提供者調用函數。 從Firebase調用get函數以及我在控制檯中獲得的是ZoneAwarePromise。我究竟做錯了什麼?從Firebase快照值獲取ZoneAwarePromise

xx.component.ts文件:

constructor(private db: Database) { 

    console.log(db.getActiveUserData()); 

} 

database.ts文件:

getActiveUserData(){ 
    return this.database.child('/users/' + this.as.id).once('value').then((snapshot) => { 
     return snapshot.val(); 
    }) 
} 

控制檯日誌:

ZoneAwarePromise __zone_symbol__state:真

__zone_symbol__value : 對象 姓 : 弗雷德裏克 UID : 「zLmRHwQRM0cehsSrGNXaH2WnSgk2」

: 對象 : 對象

我如何收到的數據作爲一個普通的目的?

當我使用database.ts內控制檯日誌,它的一切優秀的

+1

您不能將實時異步操作轉換爲同步返回值。你需要異步使用它們,傳遞諾言,並等待它解決(把你的console.log()放入.then(),例如'db.getActiveUserData()。then(console.log) ' – Kato

回答

1

你們看到的是預期的行爲。

once返回一個承諾,這就是getActiveUserData返回的結果。你不能讓它返回快照的值。但是,您可以獲取返回的承諾,以解決快照值:

getActiveUserData() { 

    return this.database 
    .child('/users/' + this.as.id) 
    .once('value') 
    .then((snapshot) => snapshot.val()); 
} 

,你會打電話來是這樣的:

@Component({ 
    selector: "some-component", 
    template: `<code>{{ activeUserData | json }}</code>` 
}) 
class SomeComponent { 

    activeUserData: any; 

    constructor(private db: Database) { 

    db.getActiveUserData().then((val) => { this.activeUserData = val; }); 
    } 
} 

角模板明白諾言,這樣的數據可以保存爲承諾並且可以使用async管道:

@Component({ 
    selector: "some-component", 
    template: `<code>{{ activeUserData | async | json }}</code>` 
}) 
class SomeComponent { 

    activeUserData: Promise<any>; 

    constructor(private db: Database) { 

    this.activeUserData = db.getActiveUserData(); 
    } 
} 
+0

這有幫助!但是如何設置'val'爲一個變量?像this.activeuser = val。 –

+0

我已經更新了答案,但是,您可能想了解更多關於promise的知識;有很多材料可用:[promisejs.org](https://www.promisejs.org/),[JavaScript承諾:簡介](https://developers.google.com/web/fundamentals/getting-started/primers/promises) – cartant