数据未显示.Ng-reflect-ng-for-off:可以吗?

问题描述

我正在尝试从Firebase绑定数据.而且我没有收到错误，但是没有显示数据.在检查元素中，我得到了

Hi i am trying to bind a data from firebase. And I'm not getting errors but data is not showing. In inspect element i'm getting

<!--bindings={
  "ng-reflect-ng-for-of": null
}-->

我的 app.component.html 是

<ul>
    <li *ngFor="let item of items | async">
        {{item.title}}
    </li>
</ul>

和我的 app.component.ts 是

import { Component } from "@angular/core";
import { AngularFirestore } from "angularfire2/firestore";
import { Observable } from "rxjs/Observable";
import { AngularFire, FirebaseListObservable } from "angularfire2";


@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  title = "app";

  constructor(db: AngularFirestore) {}
}

如果需要app.module.ts我可以添加它.因此，关键是如何摆脱ng-reflect事物并显示我的数据.谢谢

if app.module.ts is needed i can add it. So the thing is how to get rid of that ng-reflect thing and show my data. Thank you

推荐答案

ng-reflect-ng-for-of 注释是Angular的绑定信息.这些评论即使在生产中也仍然存在，尽管在那里可能是空的.

The ng-reflect-ng-for-of comment is binding information for Angular. Those comments will still exist, even in production, though they may be empty there.

您是否在帖子的 app.component.ts 中排除了代码?

Are you excluding code from your app.component.ts in your post?

您的问题可能是由于未在组件中设置 items 属性引起的.由于使用的是 async 管道，因此暗示您期望 items 是可观察的.尝试如下设置您的 items 属性:

Your issue is probably caused by the items property not being set in your component. Since you're using the async pipe, you are implying that you are expecting items to be an observable. Try setting your items property as follows:

@Component({
    selector: "app-root",
    templateUrl: "./app.component.html",
    styleUrls: ["./app.component.css"]
})
export class AppComponent {
    title = "app";
    items: Observable<{title: string}>;

    constructor(db: AngularFirestore) {
        this.items = db.collection<{title: string}>('items').valueChanges();
    }
}

更多信息，请参见Angular Firestore文档.

这篇关于数据未显示.Ng-reflect-ng-for-off:可以吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！