Angular不通过Angularfire2提取数据

Question

I have been having a problem getting data back from the Real time Database on firebase. Everything is set correctly, the Read and Write permissions are public so I don't have to authenticate.

npm compiles successfully. So the code is good (Angular-CLI). I tried exactly what is on the GitHub page as far as the documentation goes.

When I interpolate pulling data from an Object the return on the front end is Null. When I do the same for a List the return is blank. *ngFor won't even work.

Anyone has the same problem or could help?

The code looks like this. That's a direct copy from the documentation.

My database actually has no label that says " Items " as per db.list('items') . I dont think that would be the issue, but would that create a problem?

import { Component } from '@angular/core';
import { AngularFireDatabase } from      'angularfire2/database';
import { Observable } from 'rxjs/Observable';

@Component({
  selector: 'app-root',
  template: `
  <ul>
    <li *ngFor="let item of items | async">
   {{ item | json }}
    </li>
  </ul>
  `,
})
export class AppComponent {
  items: Observable<any[]>;
  constructor(db: AngularFireDatabase) {
    this.items = db.list('items').valueChanges();
  }
}

The data in firebase has this structure..

[ 
 {"THIS" : string , "THAT" : string},
 {"THIS" : string , "THAT" : string}
]

That's what the file looks like before I uploaded.

Answer 1

I think you forgot to create the items collection.

You are subscribed to the items collection here:

this.items = db.list('items').valueChanges();

Try to import this one and see if you get some results:

{
  "items": [
    {
      "THIS": "test",
      "THAT": "test"
    },
    {
      "THIS": "test",
      "THAT": "test"
    }
  ]
}

In firebase it looks like: