如何过滤js中的对象数组？

  • Z时代
  • 2024-01-10
  • 分类：问答

我想在我的角度4组件中过滤我的数组。该阵列具有一个属性，它本身是一个数组太：如何过滤js中的对象数组？

export const data = [ 
    { 
    "number": "1", 
    "lines": [ 
     "aaaaabbbb bbbbb ccccc ddddd", 
     "aaaaabbbb bbbbb ccccc ddddd", 
     "aaaaabbbb bbbbb ccccc ddddd", 
    ] 
    } 
    , 
    { 
    "number": "2", 
    "lines": [ 
     "aaaaabbbb bbbbb ccccc ddddd", 
     "aaaaabbbb bbbbb ccccc ddddd", 
     "aaaaabbbb bbbbb ccccc ddddd", 
    ] 
    } 
    , 
    { 
    "number": "3", 
    "lines": [ 
     "aaaaabbbb bbbbb ccccc ddddd", 
     "aaaaabbbb bbbbb ccccc ddddd", 
     "aaaaabbbb bbbbb ccccc ddddd", 
    ] 
    } 
    ]

这是component.html的一部分：

<input (keyup)="search($event.target.value)" /> 
<tr *ngFor="let item of filteredData"> 
     <td>{{item.number}}</td> 
     <td>{{item.lines}}</td> 
</tr>

这是过滤器/搜索TS-代码的一部分：

export class AppComponent { 
    filteredData = data; 
    search(val: any) { 
      let ind = false; 
      console.log(val); 
      if (!val) this.filteredData = this.data; 
      //this statement does not work: 
      this.filteredData = this.data.filter(item=> item.lines.indexOf(val) >=0) 
    } 
}

如何过滤我的数据？忽略更多关于过滤语句的角码。

回答：

像这样的事情

this.filteredData = this.data.filter((item) => { 
    return item.lines.filter((inner) => { 
    return inner.includes(val); 
    }).length > 0; 
});

或者

for (const item of this.data) { 
    for (const inner of item.lines) { 
    if (inner.includes(val)) { 
     return item; 
    } 
    } 
}

回答：

过滤基于item.lines.indexOf(val)有效地说：

给我唯一的项目，其中在item.lines对象的至少一个等于val。

这是不一样的你想要做什么，这就是：

给我只在那里item.lines对象的至少一个包含val作为一个子项目。

您需要遍历item.lines以及取得预期的结果 - 单独的东西，这些行*应该工作：这样

item => item.lines.includes(line => line.indexOf(val) >= 0)

问题，你要小心调用阵列的方法，而比它的内容通常容易发现，因为你会得到一个错误 - 这一个由于Array和String有一个方法称为indexOf这个事实而变得复杂！

*双关语不打算

以上是 如何过滤js中的对象数组？ 的全部内容， 来源链接： utcz.com/qa/259166.html

回到顶部