2017-08-31 77 views
0

我有一个用于显示帖子列表的angularfire2列表。每篇文章都包含一个子节点(收藏夹),其中包含将其标记为收藏夹的用户的ID。如何从angularfire2列表中访问子节点的值?

我希望能够做的是将收藏夹与当前用户ID进行比较,以确定是否显示添加到收藏夹按钮。

我的问题是,我如何访问子节点收藏夹中的值,以检查它是否包含当前用户,因此我可以使用* ngIf来隐藏按钮?

示例模板:

<ion-card *ngFor="let item of posts | async"> 
    <img src="{{ item.img }}" /> 
    <ion-card-content> 
     <button ion-button (click)="postsProvider.addFavourite(item.$key)">add to favourites</button> 
     <p> 
      {{ item.reason }} 
     </p> 
    </ion-card-content> 
</ion-card> 

示例结构:

"reasons" : { 
    "-KsjNGF9MOj9PYVtcP0F" : { 
     "favourites" : { 
     "wYWVy8eR85btVhLw7ra9eLSce632" : true, 
     "l6ivMgzNE9ZUmHQRwySoaMgiW0J3" : true 
     }, 
     "img" : "https://firebasestorage.googleapis.com", 
     "reason" : "asadafaf", 
     "userId" : "wYWVy8eR85btVhLw7ra9eLSce632" 
    }, 
    "-KsjWsxJT14IZT-u-mSZ" : { 
     "dateCreated" : "Tue Aug 29 2017 18:38:02 GMT+0000 (GMT)", 
     "favourites" : { 
     "l6ivMgzNE9ZUmHQRwySoaMgiW0J3" : true 
     }, 
     "img" : "https://firebasestorage.googleapis.com/v0/b/", 
     "reason" : "asdasdasda", 
     "userId" : "wYWVy8eR85btVhLw7ra9eLSce632" 
    }, 
    } 

我一直在应用程序的其它部分,即显示用户的最爱,我发现一些看起来很奇怪的页面对我来说。

的收藏夹页面使用下面的函数来获取收藏最多的项目

getUserFavourites() { 
    let user = firebase.auth().currentUser.uid; 
    return this.db.list('/reasons/', { 
     query: { 
      orderByChild: 'favourites/' + user + '/favourited', 
      equalTo: true 
     } 
    }); 
    } 

然后我显示这样的信息:

<ion-content> 
    <ion-card *ngFor="let item of posts | async" (click)="itemTapped($event, item)"> 
     <div class="card-img" [style.backgroundImage]="'url(' + item.img + ')'"></div> 

     <div class="remove-favourite" (click)="postsProvider.removeFavourite(item.$key)"> 
      <ion-icon name="close"></ion-icon> 
     </div> 
     <ion-card-content> 
      <ion-card-title> 
       {{ item.reason }} 

      </ion-card-title> 
      <p> 
       {{ item.favourites[userId].note }} 
      </p> 
     </ion-card-content> 
    </ion-card> 
</ion-content> 

使用这种方法,我能够使用{{项目。收藏夹[userId] .note}}并返回该值。但是,除了略有不同的查询(下面)外,几乎相同的设置不起作用。

getPosts(limit) { 
    return this.db.list('/reasons', { 
     query: { 
      limitToFirst: limit 
     } 
    }); 
} 

我觉得我失去了一些东西很明显,但我不明白为什么会有结果之间的差异除了他们使用略有不同的查询。

回答

0

我找到了导致问题的原因。

当我使用* ngIf =“post.favourites [userId] .favourited!== true”或尝试显示该值时,如果帖子没有任何收藏夹,则会显示错误。

为了解决这个问题我添加了一个检查,以确保post.favourites是通过添加或声明

*ngIf="!post.favourites || post.favourites[userId].favourited !== true" 
设置