尝试从Firebase中获取用户个人资料数据,然后将其显示在主页上时,出现异步错误。我尝试在chat.component.html中删除异步,这消除了错误,但没有显示任何数据。
chat.component.html
<!DOCTYPE html>
<html>
<head>
<title>Chat App</title>
</head>
<body>
<h1>Chat App</h1>
<ul>
<li *ngFor="let message of messages | async">{{message.$value}}</li>
</ul>
<input id="messages" type="text" #message placeholder="Enter your message">
<button (click)="newMessage(message.value)">Send message</button>
</body>
</html>
chat.component.ts
import { Component, OnInit } from '@angular/core';
import { AngularFireDatabase, AngularFireList } from 'angularfire2/database';
@Component({
selector: 'app-chat',
templateUrl: './chat.component.html',
styleUrls: ['./chat.component.css']
})
export class ChatComponent implements OnInit {
messages: AngularFireList<any[]>;
constructor(public db: AngularFireDatabase) {
}
ngOnInit() {
this.getChatData();
}
getChatData() {
this.messages = this.db.list('chat_messages');
}
newMessage(message) {
this.messages.push(message);
}
}