首页 > 解决方案 > 如何遍历对象,仅显示与其所有元素相互的结果

问题描述

我正在制作一个简单的应用程序,在 Angular7 上编写,它获取产品的输入(例如“苹果橙草莓”)并显示包含所有产品作为成分的食谱。所需的一切,如食谱、配料等都保存在 JSON 文件中。它仅在我有一个产品作为输入时才有效。问题是我想遍历输入中的所有成分并显示食谱,哪些成分具有所有产品。

这是 JSON 文件的对象的样子:

{
      "id": 1,
      "name": "some name",
      "ingredients": "some ingredients",
      "recipe": "some recipe"
    }

这就是我将输入作为对象获取然后将其拆分以便获取每种成分的方式:

 this.pattern = this.searchForm.value;
 this.patternObj = this.pattern.name.split(" ");

这就是我过滤和收集具有特定成分的元素的方式:

this.result = res.filter(v => v.ingredients.indexOf(this.patternObj) > -1); 

我试图 foreach patternObj,但在这种情况下,它只显示对象最后一个产品的配方。

标签: javascriptjqueryobjectforeachiteration

解决方案


您应该使用该函数some来检查至少一个元素,并使用该函数includes检查目标数组中是否存在一个元素。

this.result = res.filter(v => v.ingredients.some(ing => this.patternObj.includes(ing)));

推荐阅读