首页 > 解决方案 > 如何过滤在其嵌套项目列表中包含“电视”项目的发票列表 - 使用 TypeScript

问题描述

我有一组“发票”对象。在这个数组中,有一个嵌套的“Items”数组。例子:

[
   {
      "invoiceNo":"10",
      "customerId":"101",
      "invoiceTotal":"2500",
      "items":[
         {
            "itemId":"1",
            "itemName":"TV"
         },
         {
            "itemId":"2",
            "itemName":"Laptop"
         },
         {
            "itemId":"3",
            "itemName":"PC"
         }
      ]
   },
   {
      "invoiceNo":"11",
      "customerId":"102",
      "invoiceTotal":"7500",
      "items":[
         {
            "itemId":"2",
            "itemName":"Laptop"
         },
         {
            "itemId":"3",
            "itemName":"PC"
         }
      ]
   }
]

我只想返回包含“TV”项目的所有发票的数组。

以下是我的代码

let text = queryText.toLowerCase();
    return this.http
      .get<Invoices[]>(
        this.url + "/crm-operations/application/invoices",
        { headers: headerInfo }
      )
      .pipe(
        map((invoicesData) =>
        invoicesData.filter((invoice) => {
            if (invoice.items) {
              invoice.items.filter((row) => { 
                 row.itemName.toLowerCase().indexOf(text)>-1;
              });
            }
          })
        )
      );

结果始终是一个空数组 IT 必须返回一个带有发票编号“10”对象的数组。有什么问题是我的代码。还有另一种方法可以解决这个问题吗?

标签: angulartypescriptrxjs

解决方案


将操作员的主体更改为map

invoicesData.filter((invoice) =>
  // (1)
  invoice.items?.some((row) => // (2)
    // (3)
    row.itemName.toLowerCase().indexOf(text)>-1
  )
)

(1)删除花括号以返回值 ( true/ false)invoice.items?.some(..)

(2)而不是filter我们使用some. 它的效率更高一些,因为一旦内部函数返回某个项目,它就不会遍历所有剩余的数组项目true

(3)删除花括号以隐式返回结果row.itemName.toLowerCase().indexOf(text)>-1


推荐阅读