如何过滤已从 firebase 检索到的数据?

how to filter already retrieved data from firebase?

我在 '/posts/' 下有一个帖子列表,我已经检索了所有帖子并将其存储在一个数组中 all_posts:

get_all_posts(){

 this.all_posts = [];
 firebase.database().ref('/posts/').once('value').then(snapshot => {

 foreach.snapshot{
    let tmp_data = {
        post_id: snapshot.key,
        title: snapshot.val().title,
        type: snapshot.val().type,
        }   
    this.all_posts.push(tmp_data);
 }

}

现在我想在单击按钮时过滤类型 = "news" 的帖子(有 2 种类型:新闻和博客)

<ion-button (click)="show_only_posts_type_news()">show only news</ion-button>

show_only_posts_types_news(){

 //this.posts
 // filter only type == "news"

}

有没有更简单的过滤方法all_posts?没有另一个 firebase 查询只显示新闻类型?

您可以使用 Array.filter。您可以提供一个过滤函数,它将评估和 return 只有那些满足您条件的元素。

var news_posts = this.all_posts.filter(post => post.type === 'news')

由于您已经循环浏览快照,如果您在该循环中进行过滤而不是再次循环 all_posts 以获取新闻并可能稍后获取博客,这可能会更好array.filter 在后台运行。

get_all_posts(){

this.news_posts = [];
this.blogs_posts = [];
firebase.database().ref('/posts/').once('value').then(snapshot => {

foreach.snapshot{ 
 let tmp_data = {
        post_id: snapshot.key,
        title: snapshot.val().title,
        type: snapshot.val().type,
         }  
  if(tmp_data.type === 'news'
  {
    this.news_posts(tmp_data)
  }
  else
  {
    this.blogs_posts(tmp_data)
  }
 }
}

非常感谢@Ashish(对于 Array.filter 功能,打开了许多过滤数据的方式)。 @Mocas 以后会有更多种类的post,你的方法也可以

我最终这样做了,一个在点击按钮时过滤 post 类型的函数,不确定它是否最好,但按预期工作:

我先分配了3个数组:

rows = [];          //the row that contains displaying data on the view
all_rows = [];      //the row that contains all the posts
filtered_rows = []; //the row that contains only filtered posts

过滤函数:

filter_posts_by_type(type){

    this.filtered_rows = this.all_rows; 
    //reset the filtered_rows with all data first

    if(type == "news"){

        this.rows = this.filtered_rows.filter((item) => {
            return item.type.toLowerCase() == "news"; 
            //set this.rows to contain all posts of type : news
        })

    }else if(type == "blog"){ 

        this.rows = this.filtered_rows.filter((item) => {
            return item.type.toLowerCase() == "blog"; 
           //set this.rows to contain all posts of type : blog

        })
    }else{
        // all types
        this.rows = this.filtered_rows.filter((item) => {
            return item.type.toLowerCase() == "news" || item.type.toLowerCase() == "blog"; 
           //set this.rows to contain all posts types
        })
    }
}