Michael Ashefor
Michael Ashefor

Reputation: 134

How to loop through an array of objects, loop through each object and push each object into separate arrays for ngFor looping in angular

I am working on an Angular 7 project and I am dealing with an api that returns an array of (recipes)objects on search and I want to get the all ingredients from each object so I can loop through them, get only what I want because each (recipe)object varys from the other

I have tried looping through the initial array of objects and then looped through each individual object and getting only the available ingredients per (recipe)object but I do not know how to push them into separate arrays. Whenever I push, all ingredients from all the objects gets pushed into a single array.

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) 
            }
          }
        }
      }
    }
   }
  })


}

}

I have been able to loop through and get each ingredients from each (recipe)object but have been unable to push them into separate arrays without having to define multiple arrays. Is there a way I can push all ingredients from a (recipe)object into a separate array without having other ingredients from other (recipes)object added? I do not want to define several arrays because I am working with an api and I do not know the expected search results all the time search results showing an array of objects

Upvotes: 0

Views: 1577

Answers (3)

Lahiru Samishka
Lahiru Samishka

Reputation: 119

    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

Upvotes: 0

Daniel Prosianikov
Daniel Prosianikov

Reputation: 118

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

    }

Upvotes: 1

Daniel Prosianikov
Daniel Prosianikov

Reputation: 118

Just push obj, not y[obj]. Probably, I do not understand the task. And use of instead of in. Or do you wanna get some ingredient substrings from object?

Upvotes: 0

Related Questions