简体   繁体   English

如何过滤嵌套对象数组 Javascript

[英]How to filter an Array of nested objects Javascript

I have an Array for recipes and inside of it I have another Array ingredients with some objects, what I want is to filter the recipes array by comparing the nested object key ingredient with entered value in the Input field (keyup event is working and I have the values form the input fild stored in a variable called enteredValue )...我有一个食谱数组,在它里面我有另一个带有一些对象的数组成分,我想要的是通过将嵌套的 object 关键成分与输入字段中输入的值进行比较来过滤食谱数组(keyup 事件正在工作,我有这些值形成存储在名为enteredValue的变量中的输入字段)...

Soo can you help me find how to filter recipes using those nested array那么你能帮我找到如何使用那些嵌套数组过滤食谱

 const recipes = [{ "id": 1, "name": "Limonade de Coco", "servings": 1, "ingredients": [{ "ingredient": "Lait de coco", "quantity": 400, "unit": "ml" }, { "ingredient": "Jus de citron", "quantity": 2 } ], "time": 10, "description": "Mettre les glaçons à votre goût dans le blender, ajouter le lait, la crème de coco, le jus de 2 citrons et le sucre. Mixer jusqu'à avoir la consistence désirée", "appliance": "Blender", "ustensils": ["cuillère à Soupe", "verres", "presse citron"] }, { "id": 2, "name": "Poisson Cru à la tahitienne", "servings": 2, "ingredients": [{ "ingredient": "Thon Rouge (ou blanc)", "quantity": 200, "unit": "grammes" }, { "ingredient": "Concombre", "quantity": 1 }, { "ingredient": "Tomate", "quantity": 2 }, { "ingredient": "Lait de Coco", "quantity": 100, "unit": "ml" } ], "time": 60, "description": "Découper le thon en dés, mettre dans un plat et recouvrir de jus de citron vert (mieux vaut prendre un plat large et peu profond). Laisser reposer au réfrigérateur au moins 2 heures. (Si possible faites-le le soir pour le lendemain. Après avoir laissé mariner le poisson, coupez le concombre en fines rondelles sans la peau et les tomates en prenant soin de retirer les pépins. Rayer la carotte. Ajouter les légumes au poissons avec le citron cette fois ci dans un Saladier. Ajouter le lait de coco. Pour ajouter un peu plus de saveur vous pouver ajouter 1 à 2 cuillères à soupe de Crème de coco", "appliance": "Saladier", "ustensils": ["presse citron"] } ] let filteredRecettesIngrediants = recipes.map(receipt => { return receipt.ingredients.filter(ingredientKey => { return (ingredientKey.ingredient === 'Carotte') }) }) console.log(filteredRecettesIngrediants)

If you want to get every recipe which contains the entered ingredient, try this:如果您想获取包含输入成分的每个食谱,请尝试以下操作:

recipes.filter(r => r.ingredients.some(i => i.ingredient === enteredValue));

This gets all items in recipes where at least one item in ingredients has a value for ingredient that is equal to enteredValue .这将获取recipes中的所有项目,其中至少一项ingredientsingredient值等于输入的enteredValue

recipes.filter(recipe => recipe.ingredients.some(ingred => ingred.ingredient == inputValue))

The some method returns true if at least one entry satisfies the function given, in this case that the value of "ingredient" in each ingredient in the recipe has a value of inputValue .如果至少一个条目满足给定的 function,则some方法返回 true,在这种情况下,配方中每种成分的"ingredient"值的值为inputValue If at least one entry returns true then the recipe contains that ingredient so you can add the whole recipe to the filtered output list.如果至少有一个条目返回 true,则配方包含该成分,因此您可以将整个配方添加到过滤后的 output 列表中。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM