如何遍历对象数组，遍历每个对象并将每个对象推入单独的数组中，以便 ngFor 以角度循环答案

【问题标题】：How to loop through an array of objects, loop through each object and push each object into separate arrays for ngFor looping in angular如何遍历对象数组，遍历每个对象并将每个对象推入单独的数组中，以便 ngFor 以角度循环
【发布时间】：2019-06-05 19:50:29
【问题描述】：

我正在开发一个 Angular 7 项目，我正在处理一个 api，它在搜索时返回一组（食谱）对象，我想从每个对象中获取所有成分，这样我就可以遍历它们，只得到什么我想要，因为每个（食谱）对象都不同

我尝试循环遍历初始对象数组，然后遍历每个单独的对象并仅获取每个（配方）对象的可用成分，但我不知道如何将它们推送到单独的数组中。每当我推送时，所有对象的所有成分都会被推送到一个数组中。

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { RecipesService } from 'src/app/services/recipes.service';

@Component({
selector: 'app-search',
templateUrl: './search.component.html',
styleUrls: ['./search.component.scss']
})
export class SearchComponent implements OnInit {
s: string;
ingArray: any[] = []
measurementsArr = []
nothingFound = false;
itemsFound = false;
searchedData: any[] = [];
searchresults: number;
constructor(private route: ActivatedRoute, private service:RecipesService) { }

ngOnInit() {
this.route.queryParams.subscribe(params=>{
  this.s = params.s;
  console.log(this.s)
})
this.searchDB()
}

searchDB(){
this.service.searchRecipeDB(this.s).subscribe((res:any)=>{
  if(res.meals === null){
    this.nothingFound = true;
  }else{
    this.searchedData = res.meals
    console.log(this.searchedData)
    this.itemsFound = true;
    this.searchresults=this.searchedData.length;
    let resultsarray = this.searchedData
    for(let y of resultsarray){ 
      for(let obj in y){ 
        if(obj.includes('strIngredient')){ 
          if(y[obj]!=null){ 
            if(y[obj].length > 0){ 
              this.ingArray.push(y[obj])  
              console.log(this.ingArray) 
            }
          }
        }
      }
    }
   }
  })


}

}

我已经能够循环并从每个（配方）对象中获取每种成分，但无法将它们推送到单独的数组中而无需定义多个数组。有没有一种方法可以将（食谱）对象中的所有成分推送到单独的数组中，而无需添加来自其他（食谱）对象的其他成分？我不想定义多个数组，因为我正在使用 api，而且我一直不知道预期的搜索结果search results showing an array of objects

【问题讨论】：

可以分享一下搜索结果的数据结构或者分享一个json格式的示例结果吗？
太长了，可以看看这个链接吗->i.stack.imgur.com/s6IWU.png

标签： arrays angular angular7

【解决方案1】：

for(let y of resultsarray){
     ingrSub: Array<any> = new Array();
      for(let obj in y){ 
        if(obj.includes('strIngredient')){ 
          if(y[obj]!=null){ 
            if(y[obj].length > 0){ 
              ingrSub.push(y[obj])  
              console.log(this.ingArray) 
            }
          }
        }
      }
    if(ingrSub.length > 0)
          this.ingArray.push(ingrSub)
    else
       ingrSub = null;//just to be sure that we do not leak the memory if engine thinks the oposite in some case

    }

【讨论】：

谢谢，但使用 ngfor 仍会显示所有成分，而不是每个配方的成分
但请您解释一下ingrSub: Array<any> = new Array() 的作用？
当然，它声明了新的本地数组对象，但不是作为类成员。然后你用你的值填充这个数组并将这个数组的引用添加到类成员数组中。

【解决方案2】：

只推 obj，而不是 y[obj]。可能，我不明白这个任务。并使用 of 而不是 in。或者您想从对象中获取一些成分子字符串吗？

【讨论】：

推 obj 而不是 y[obj] 做同样的事情。我正在尝试将配方 A 的所有成分推入一个数组，然后将配方 B 的所有成分也推入一个数组，而无需声明两个单独的数组
好的，你在哪里创建代码中的第二个数组？您将每个食谱推送给一位班级成员。你说的是哪个第二个数组？
我只有一个数组，因为我正在使用一个 api，我不知道每次搜索会带来多少对象，所以我想知道我是否可以一遍又一遍地使用同一个数组跨度>
二维数组或者map怎么样？每次成功的搜索都会将你的数据的一个子数组添加到类数组中
请问我该怎么做？

【解决方案3】：

    this.array_a = [] <- this add your array

this.array_b.forEach(array_b_item => {
  array_b_item.new_variable = JSON.parse(
    JSON.stringify(this.array_a)
  ); 
});

you can add values indivualy to array_b

【讨论】：