AngularFire2返回[對象對象]

我想弄清楚一切都出了問題。我所有的觀察對象都返回[object Object]。AngularFire2返回[對象對象]

我sunshine.component.html

<h4>Welcome {{username$}}</h4> 
<ul> 
<li *ngFor="let addsnote of addsnotes$ | async">{{ addsnote }}</li> 
</ul>

我sunshine.component.ts

import { Component, OnInit, Injectable } from '@angular/core'; 
import { FormGroup, FormControl } from '@angular/forms'; 
import { AngularFire, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2'; 

export class ProfileComponent implements OnInit { 
    private addsnotes$: FirebaseListObservable<string[]>; 
    private username$: FirebaseObjectObservable<string>; 
    private profileshow = false; 
    addForm: FormGroup; 

    constructor(private af: AngularFire){ 
    this.addForm = new FormGroup({ 
     'addnote': new FormControl() 
    }); 
    } 

    ngOnInit(){ 
    let user = firebase.auth().currentUser, 
    userNamePath = `users/${user.uid}/username`, 
    notesPath = `users/${user.uid}/addnote`; 
    this.username$ = this.af.database.object(userNamePath); 
    this.addsnotes$ = this.af.database.list(notesPath); 
    } 

    addSubmit(){this.addsnotes$.push('Billy Dee Williams');} 

}

我的火力地堡數據庫的某些部分

{ 
    "users" : { 
    "4twiyaFxVmaESXGWIfW4BwRXh893" : { 
     "addnote" : { 
     "-KSmWtpUSFXPCL4O3aKr" : "Do the dishes" 
     }, 
     "useremail" : "[email protected]", 
     "username" : "majic" 
    }, 
    "PYuSE6zyAENdKREZGTHm5VH1DXn1" : { 
     "addnote" : { 
     "-KSoZM7sH6X5ahMq7S5y" : "Du the dishes", 
     "-KSoZMimZzm6ZGQowmuL" : "Du the dishes", 
     "-KSouEXkc1UkyISGTCHd" : "Du the dishes" 
     }, 
     "useremail" : "[email protected]", 
     "username" : "asdasd" 
    } 
    } 
}

我的網頁的屏幕截圖（爲清楚起見）

編輯我已經包括了我正在進行的項目的回購這裏，從而爲您提供一切儘可能多的信息作爲可能。希望它是有用的。

https://github.com/emjayweb/demo

各文件在SRC /應用/簡檔/ profile.component。由於這完全是WIP，請不要爲它的後勤問題感到擔憂（警衛路由，驗證等）。

這種方式的作用是在主頁上輸入一些虛擬數據創建賬戶，然後點擊導航上的配置文件鏈接。您可能必須先刷新頁面。當您點擊配置文件路線中的按鈕時，您輸入'Billy Dee Williams'到您的addnote陣列，並且視圖應該反映這一點。

來源

2016-09-29 abrahamlinkedin

你需要一個'| async'，因爲FirebaseObjectObservable也是一個需要解包的異步可見性：'

歡迎{{username $ | async}}

'。我們正在努力通過一些方法使指令更簡單。 – Kato

感謝您的信息。我想知道如何格式與對象的異步。這仍然不能解決我的'[對象對象]'問題。我仍然不明白爲什麼會發生這種情況。 – abrahamlinkedin

試着將它輸送到json然後看看你有什麼。 {{用戶名|異步| json}} – Kato

得到了答案from a different question。我必須做的是將$.value標籤添加到我的HTML。在我的名單觀察到的情況下，這本來是：

<li *ngFor="let addsnote of addsnotes$ | async">{{ addsnote.$value }}</li>

而且我觀察到的對象，這本來是：

<h4>Welcome {{ (username$ | async)?.$value }}</h4>

來源

2016-09-29 20:24:04 abrahamlinkedin

在下面的代碼中，'addsnote'是一個對象數組。

<li *ngFor="let addsnote of addsnotes$ | async">{{ addsnote }}</li>

只需檢查下面的代碼。

<li *ngFor="let addsnote of addsnotes$ | async">{{ addsnote[0] }}</li>

然後您就可以瞭解如何訪問數據。

來源

2016-09-29 09:54:35

不幸的是，這最終給我空的子彈點。 – abrahamlinkedin

有關其他信息，我使用代碼獲得的空白項目點與我的數據庫中的項目數量正確對應。所以一個'li'正在打印出來。但是，這個'li'是空的。添加或刪除相應的列表項會改變我在代碼中的空li'標籤的數量。 – abrahamlinkedin

AngularFire2返回[對象對象]

歡迎{{username $ | async}}

回答

相關問題