Angular 管道上的 .includes 返回“屬性 'includes' 在類型 'never'.ts(2339)' 上不存在錯誤消息

Question

我正在編寫一個 Angular Pipe，它必須迭代一個對象數組並按字段和字段值進行過濾。

當我檢查 value 字段是否包含被過濾的值時，我收到以下錯誤消息： Property 'includes' does not exist on type 'never'.ts(2339)

這是我的 pipe.ts 代碼：

transform(items: [], field: string, value: string): any[] {

    let res = [];

   console.log(items);

    for(let a = 0; a < items.length; a++) {

      if((items[a][field]).includes(value)) {
        res.push(items[a]);
      }

    }

    return res;
  }

我想要的是，當我通過管道傳遞一些數組時，它會檢查屬性是否包含指定的值。 數組、屬性和過濾器值在視圖上設置。 例如： <p>{{ foods | filter : 'name' : 'zz' }}</p> <p>{{ foods | filter : 'name' : 'zz' }}</p>

這是我在控制器上的數組：

foods: Object[] = [
    {
      name: "Pizza",
      calories: 400,
      image: "https://i.imgur.com/eTmWoAN.png",
      quantity: 0
    },
    {
      name: "Salad",
      calories: 150,
      image: "https://i.imgur.com/DupGBz5.jpg",
      quantity: 0
    },
    {
      name: "Sweet Potato",
      calories: 120,
      image: "https://i.imgur.com/hGraGyR.jpg",
      quantity: 0
    },
    {
      name: "Gnocchi",
      calories: 500,
      image: "https://i.imgur.com/93ekwW0.jpg",
      quantity: 0
    },
    {
      name: "Pot Roast",
      calories: 350,
      image: "https://i.imgur.com/WCzJDWz.jpg",
      quantity: 0
    },
    {
      name: "Lasagna",
      calories: 750,
      image: "https://i.imgur.com/ClxOafl.jpg",
      quantity: 0
    },
    {
      name: "Hamburger",
      calories: 400,
      image: "https://i.imgur.com/LoG39wK.jpg",
      quantity: 0
    },
    {
      name: "Pad Thai",
      calories: 475,
      image: "https://i.imgur.com/5ktcSzF.jpg",
      quantity: 0
    },
    {
      name: "Almonds",
      calories: 75,
      image: "https://i.imgur.com/JRp4Ksx.jpg",
      quantity: 0
    },
    {
      name: "Bacon",
      calories: 175,
      image: "https://i.imgur.com/7GlqDsG.jpg",
      quantity: 0
    },
    {
      name: "Hot Dog",
      calories: 275,
      image: "https://i.imgur.com/QqVHdRu.jpg",
      quantity: 0
    },
    {
      name: "Chocolate Cake",
      calories: 490,
      image: "https://i.imgur.com/yrgzA9x.jpg",
      quantity: 0
    },
    {
      name: "Wheat Bread",
      calories: 175,
      image: "https://i.imgur.com/TsWzMfM.jpg",
      quantity: 0
    },
    {
      name: "Orange",
      calories: 85,
      image: "https://i.imgur.com/abKGOcv.jpg",
      quantity: 0
    },
    {
      name: "Banana",
      calories: 175,
      image: "https://i.imgur.com/BMdJhu5.jpg",
      quantity: 0
    },
    {
      name: "Yogurt",
      calories: 125,
      image: "https://i.imgur.com/URhdrAm.png",
      quantity: 0
    }
  ]

如果我在循環中執行console.log(items[a][field]我不明白為什么 .contains 會拋出錯誤，我正確地得到了食物的名稱。

Answer 1

考慮行transform(items: [], field: string, value: string): any[] {特別是items: []這表明 item 的類型是一個空數組，因此錯誤

要解決這個問題，只需提供一個類型，您可以從item: any[]開始item: any[]