时间戳

首页 > 解决方案 > 搜索栏过滤器（嵌套数组）

ionic-framework - 搜索栏过滤器（嵌套数组）

问题描述

如何使用搜索栏过滤 ionic 4 搜索栏中的嵌套数组对象

ionic version-4.7.1 下面我附加了我的 Filter 函数，但我不能使用这个函数来过滤嵌套数组中的对象

this.filterData = this.allData.filter(data => {if (data.letter && this.searchTerm) {
for (var i = 0; i < data.child_contacts.length; i++) {
  if (
    data.child_contacts[i].full_name
      .toLowerCase()
      .indexOf(this.searchTerm.toLowerCase()) > -1
  ) {
    return (
      data.child_contacts[i].full_name
        .toLowerCase()
        .indexOf(this.searchTerm.toLowerCase()) > -1
    );
  }
}
return false;}});

这是需要过滤的数据

this.allData=[    { 
     "letter":"A",         
     "child_contact":[
          {"full_name":"First"},
          {"full_name":"second"},
          {"full_name":"third"}
     ]
},
{ 
     "letter":"B",         
     "child_contact":[
          {"full_name":"First second"},
          {"full_name":"Third"}
     ]
},
{ 
     "letter":"C",         
     "child_contact":[
          {"full_name":"Third"}
     ]
}        ]

如果我搜索“第一”，我的预期输出将是，

[    { 
     "letter":"A",         
     "child_contact":[
          {
                    "full_name":"First"
                  },    
     ]
},
{ 
     "letter":"B",         
     "child_contact":[
                  {
                    "full_name":"First"
                  },    
     ]
}]

标签： ionic-frameworkionic4

解决方案

我不确定这是否是完整的解决方案，但我可以看到的一个问题是您在过滤器中使用child_contacts了一个，s

for (var i = 0; i < data.child_contacts.length; i++) {

但数据是child_contact：

this.allData=[    { 
     "letter":"A",         
     "child_contact":[
          {"full_name":"First"},
          {"full_name":"second"},
          {"full_name":"third"}
     ]
},

推荐阅读