找不到“object”类型的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables,例如 Arrays.(AngularFireList)

Posted

技术标签:

【中文标题】找不到“object”类型的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables,例如 Arrays.(AngularFireList)【英文标题】:Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.(AngularFireList) 【发布时间】:2019-05-12 23:56:51 【问题描述】:

我尝试以 this tutorial 从 firebase 数据库中检索数据 但我收到此错误;

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.(AngularFireList)

我想检索当前用户的特定数据(当用户登录应用时)

谁能帮我解决这个问题

这个html页面

<ion-content padding>
  <!--  مسسوول عن عرض البيانات  -->
  <ul *ngFor ="let d of datanote " class="collection" class="colorul" text-right >
    <li class= "collection-item" >
      <ion-card class="backgounddiv" >     
        <ion-card-header>
          <strong class="colorli" >d.title<br></strong>
        </ion-card-header>
        <ion-card-content>
          <strong class="colorli" >d.desciption</strong>
        </ion-card-content>   
      </ion-card>
    </li>
  </ul>
</ion-content>

这个 ts 页面

export class HomePage 
  datanote :AngularFireList<users[]> ;
  userId: string;

  constructor(
    public navCtrl: NavController,
    private ev: Events,
    public firestoreService:FierbaceserverProvider,
    public navParams: NavParams, 
    private afAuth: AngularFireAuth,
    private db: AngularFireDatabase 
  )   

  ngOnInit():AngularFireList <users[]> 
    if (this.userId) return;

    this.datanote=this.db.list(`note-list/$this.userId`);

    return this.datanote; 
  

【问题讨论】:

如果你这样做了,console.log(this.datanote) 你看到了什么?目的?大批?同样ngOnInit() 返回void 见angular doc 如果你这样做,console.log(this.datanote) ?nothing 【参考方案1】:

this.datanote 目前是一个引用,它不包含数据库值,要获取这些值,您需要等待 observable。

private noteList$: Subscription;

ngOnInit() 
  if (this.userId) return;

  this.noteList$ = this.db.list(`note-list/$this.userId`)
    .snapshotChanges()
    .subscribe(snapshot => 
      this.datanote = snapshot;
    );


ngOnDestroy() 
  noteList$.unsubscribe();

然后您应该更新您的 HTML 以检查 this.datanote 是否存在,并在 ion-content 上使用 ngIf="datanote"

<ion-content *ngIf="datanote" padding>
  <!--  مسسوول عن عرض البيانات  -->
  <ul *ngFor ="let d of datanote " class="collection" class="colorul" text-right >
    <li class= "collection-item" >
      <ion-card class="backgounddiv" >     
        <ion-card-header>
          <strong class="colorli" >d.title<br></strong>
        </ion-card-header>
        <ion-card-content>
          <strong class="colorli" >d.desciption</strong>
        </ion-card-content>   
      </ion-card>
    </li>
  </ul>
</ion-content>

【讨论】:

我有一个疑问。通过将关键字 async 添加到回调 fns,您是否推迟了它的执行。能解释一下这里的用法吗?tnx 好接,我不是故意加async 在这一行给我错误 this.datanote = snapshot; 错误是什么?我还没有测试过代码,但总体思路应该可行。 错误(类型'AngularFireAction>[]'不可分配给类型'AngularFireList'。类型'AngularFireAction>[]'。)

以上是关于找不到“object”类型的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables,例如 Arrays.(AngularFireList)的主要内容,如果未能解决你的问题,请参考以下文章

错误:找不到类型为“object - Angular 7”的不同支持对象“[object Object]”[重复]

找不到“object”类型的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables,例如 Arrays.(AngularFireList)

找不到“object”类型的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables,例如带有异步管道的数组

Angular 4 找不到“object”类型的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables,例如 Arrays

找不到“object”类型的不同支持对象“[object Object]”。仅支持在从 JSON 文件读取和解析数据时绑定到 Iterables

找不到“object”类型的不同支持对象“[object Object]”。 --> 要在表格中显示的 VirusTotal JSON