how can l read data form firebase

Question

I'm trying to push data to firebase database by userId , even each user he can modify has post or has information . the pushed data is successfully , but the problem is when l am try to getting data in html dose not show .

database

html

code for getting data :

items: Observable<any[]>;
itemsRef: AngularFireList<any>;
  constructor(public fire: AngularFireAuth,public db: AngularFireDatabase) 
    {
        this.itemsRef = db.list(`report/`);
        // Use snapshotChanges().map() to store the key
        this.items = this.itemsRef.snapshotChanges().pipe(
          map(changes => 
            changes.map(c => ({ key: c.payload.key, ...c.payload.val() }))
          )

        );

      }

html

 <ion-list *ngFor="let item of items | async"> 
    <ion-item-sliding>
      <ion-item>
        <h2>{{itemstitle}}</h2>
        <p>{{item.name}}</p>
        <p>{{item.username}}</p>
        <p>{{item.dateadded}}</p>
    </ion-item>

      <ion-item-options side="right"> 
        <button ion-button color="danger" (click)="deletReport(item.key)">
          <ion-icon  ios="ios-trash" md="md-trash" item-end large></ion-icon>
        </button>
        <button ion-button color="primary" (click)="updatereport(item.key,item.name,item.title)">
          <ion-icon ios="ios-create" md="md-create"></ion-icon>
        </button>
      </ion-item-options>

    </ion-item-sliding>
  </ion-list>

my push data :

name :string='';
  title :string='';
  Email:string='';
  dateadded:string='';
  userId: string;

  reports: AngularFireList<any>;
  items: Observable<any[]>;

  constructor(db: AngularFireDatabase,public alertCtrl: AlertController,public loadingCtrl: LoadingController,
    public navCtrl: NavController,public fire: AngularFireAuth) {
     var newPostKey = db.database.ref().child('report').push().key;
    this.reports = db.list(`report/${this.userId=fire.auth.currentUser.uid}/`);

    console.log(this.userId=fire.auth.currentUser.uid)

  }

  formatDate (date): string{

    const day = new Date().getDate();
    const month = new Date().getMonth()+1;
    const year = new Date().getFullYear();
    return `${day}-${month}-${year}`
  }
// dateaddread(dateadded){
//   this.dateadded = this.formatDate(dateadded)
// }

  Publish(name,title,dateadded){
    if (name.trim().length === 0) {
      console.log(this.name);
      let alert = this.alertCtrl.create({
        title: 'Error',
        message: 'Please fill report blank ',
        buttons: ['OK']
    });
    alert.present(); 
    }else if (title.trim().length === 0){

      let alert = this.alertCtrl.create({
        title: 'Error',
        message: 'Please fill title blank ',
        buttons: ['OK']
    });
    alert.present(); 
    }else {

      this.reports.push({
        name:name,
        title:title,
        Email:this.fire.auth.currentUser.email,
        dateadded:this.formatDate(dateadded)

      }).then(Newreport=>{
        let alert = this.alertCtrl.create({
          title: 'Successful',
          message: 'Successfully posted',
          buttons: [
            {
              text: 'Ok',
              handler: () => {
            let navTransition = alert.dismiss();
            // start some async method
            navTransition.then(() => {
            this.navCtrl.pop().then(data => {
            this.navCtrl.setRoot(FeedPage)

            });
       });
      return false;
    }
    }]          
    });

      alert.present()

      })
    }

    }

any idea please with simple code ?

Answer 1

this.reports = db.list(`report/${this.userId=fire.auth.currentUser.uid}/`);

this.reports.push({
    name:name,
    title:title,
    Email:this.fire.auth.currentUser.email,
    dateadded:this.formatDate(dateadded)
})

为显示HTML数据，您只需要修改查询以仅获取已登录用户的数据

this.itemsRef = db.list(`report/` + fire.auth.currentUser.uid);