ngfor inside ngfor for 导致错误

Question

我有一个由部分组成的火碱json对象。部分内部也是部分线程。我正在尝试迭代这些部分，然后迭代线程。问题是我收到此错误

InvalidPipeArgument： '[object Object]' for pipe 'AsyncPipe'

当我为线程添加第二个 *ngFor 时

这是我的网页

<div *ngFor="let section of forumSections | async">
<div>Header title: {{section.sectionTitle}}</div>
<div *ngFor="let thread of section.sectionThreads | async">
<div>Thread title: {{thread.title}}</div>
</div>

以及我的火碱数据库中的 JSON 对象

"forum" : {
"sections" : {
"Y6ML8AA9V5RB2sKFmKndnHFqRw23" : {
"sectionThreads" : {
"-zqehRPSbalaburpm2dW" : {
"description" : "Sup ladies",
"title" : "elo mm9"
},
"-zqehRPSbalajYGfm2dW" : {
"description" : "Sup boi",
"title" : "elo m8"
}
},
"sectionTitle" : "Official"
}
}

}

我错过了什么吗？任何帮助不胜感激，谢谢。

更新：

论坛.ts

import {Component, OnInit} from '@angular/core';
import {IonicPage} from 'ionic-angular';
import {FirebaseListObservable} from "angularfire2";
import {ForumServiceProvider} from "../../providers/forum-service/forum-service";
@IonicPage()
@Component({
selector: 'page-forum',
templateUrl: 'forum.html',
})
export class ForumPage implements OnInit {
forumSections: FirebaseListObservable<any>;
constructor(public forumService: ForumServiceProvider) {
}
ngOnInit() {
this.loadForumData();
}
loadForumData() {
this.forumSections = this.forumService.getInitialSections();
}
}

论坛服务

import {Injectable} from '@angular/core';
import 'rxjs/add/operator/map';
import {AngularFire, FirebaseListObservable} from "angularfire2";
@Injectable()
export class ForumServiceProvider {
constructor(public af: AngularFire) {
}
/**
* Get the forums front facing sections
* @returns {FirebaseListObservable<any>}
*/
getInitialSections(): FirebaseListObservable<any> {
return this.af.database.list('/forum/sections');
}
}

Answer 1

异步管道需要一个 Observable，请确保您的响应是 Observable，因为您使用的是 firebase，因此它应该是 FirebaseListObservable。

在您的情况下，我认为如果您删除第二个 ngFor 中的| async，它将解决您的问题，因为它是一个数组。

Answer 2

从您的评论来看，看起来您的第一个 ngfor 应该可以工作，第二个不会工作，因为它不再是可观察的，也不是数组。 因此，您需要将第二个转换为数组，同时删除第二个中的 ASYC 管道。

this.af.database.list('/forum/sections/')
.map(sections=>sections
.map(section=>Object.keys(section.sectionThreads)
.map(key=>section.sectionThreads[key])))

我还没有测试过它，它不是打字稿，您可能需要进行一些转换