Ionic3 / Firebase /列表过滤器

时间:2018-07-12 14:34:59

标签: typescript firebase ionic-framework

几天以来,我获得了有关如何从Firebase数据库中列出信息的信息。

this.items$ = data.getNewsList()
let user = this.auth.getName();
console.log('user > ', user);

let ref = firebase.database().ref('/ftnews')

    ref.orderByChild("owner_name")
    .equalTo(user).on("child_added", 
        function(snapshot) 
        { 
        console.log('selection > ', snapshot.key);
        return ref
        }
    );

   this.selectedNews = data.getNewsList(), 
    ref => ref.orderByChild('owner_name').equalTo('user');
    console.log('this selectedNews >', this.selectedNews);

   this.selectedNews.subscribe(
      (selectedNews) => { 
          console.log("result here >", selectedNews);
          return selectedNews;
      } 
   );

我仍然无法在控制台上获得正确的结果,但是无法在离子页面上显示结果?

有任何教程对您有帮助吗? 谢谢。

这是html:

<ion-content>
  <ion-list text-wrap> 
     <ul>
      <li *ngFor="let item of snapshotData">
        {{ item.owner_name }} — {{ item.title }}
      </li>
     </ul>
  </ion-list>

  <ion-list>
     <ul>
       <li *ngFor="let item of selectedNews | async">
         here : {{ item.owner_name }} — {{ item.title }}
       </li>
     </ul>
  </ion-list>

  <ion-list>
    <ion-item *ngFor="let item of items$ | async | orderBy: 'postedAt' 
     : true; let i = index" (click)="itemTapped(item)">
      <ion-thumbnail item-left *ngIf="item.thumb && item.thumb[0]">
          <img src={{item.thumb[0].url}}/>
      </ion-thumbnail>
      <h2>{{ item.owner_name }} — {{ item.title }}</h2>
      <p class="as-post-meta">{{ item.postedAt | date:'short'}}</p>
      <p>{{ item.body | truncate : 70}}</p>
      </ion-item>
   </ion-list>
 </ion-content>

1 个答案:

答案 0 :(得分:0)

我仍然无法在控制台上获得正确的结果,但是无法在离子页面上显示结果?

从您的问题中,我了解到您必须将值存储到变量中的几件事。然后您可以轻松地在html页面中访问

打字稿文件

Public snapshotData:any[]=[];


this.items$ = data.getNewsList()

let user = this.auth.getName();
console.log

let ref = firebase.database().ref('/ftnews')

    ref.orderByChild("owner_name")
    .equalTo(user).on("child_added", 
        function(snapshot) 
        { 
        console.log('selection > ', snapshot.key);
//here Iam assigned value to a variable
this.snapshotData=snapshot.key;
        return ref
        }
    );

如果结果可能是对象数组,则在html页面中,您可以这样显示

 <ul>
    <li *ngFor="let item of snapshotData">

    {{  Item.name }}
    </li>

如果您提供一些示例数据,我将展示如何在html页面中显示。

我也怀疑Iam在此答案变量中指出的是对还是错?如果有误,请告诉我,我将更改答案。