How do i get an object nested in another object using Angular

Question

I'm consuming an object from an api like this.

I can get the data but cant get the ChildSimpleProducts Array exclusively.

here is the product.service function

  getProducts = (): Observable<IProducts[]> => this.http.get<IProducts[]>(`${this.apiUrl + this.productsUrl}`);

and here is the component function

  data: any = [];


productsArray: Observable<IProducts>[];
getProducts() {
this.productService.getProducts().subscribe(data => {
  this.data = data;
  this.productsArray = data["$values"];
  console.log(this.productsArray)
})

}

i have tried a few things but keep getting undefined and undefined objects

Did u try this.productsArray[0].childSimpleProducts?

anonymous
– anonymous

2020-04-21 18:22:43 +00:00
Commented Apr 21, 2020 at 18:22 — anonymous
– anonymous, Commented Apr 21, 2020 at 18:22
Did u try data.$values;

Cagri Tacyildiz
– Cagri Tacyildiz

2020-04-21 18:24:45 +00:00
Commented Apr 21, 2020 at 18:24 — Cagri Tacyildiz
– Cagri Tacyildiz, Commented Apr 21, 2020 at 18:24

anonymous · Accepted Answer · 2020-04-21 18:38:43Z

3

Use forEach to loop through all the productsArray and get the childSimpleProducts,

getProducts() {
 this.productService.getProducts().subscribe(data => {
  this.data = data;
  this.productsArray = data["$values"];
  this.productsArray.forEach( e => console.log(e.childSimpleProducts);
  //this.productsArray.filter( e => e.childSimpleProducts); // This will return you an array of childSimpleProducts
 })
}

edited Apr 21, 2020 at 18:38

answered Apr 21, 2020 at 18:33

anonymous

1,7312 gold badges23 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Cagri Tacyildiz · Accepted Answer · 2020-04-21 18:37:12Z

1

If u get data from api correctly then data.$values return result

data: any = [];
productsArray: Observable<IProducts>[];
getProducts() {
    this.productService.getProducts().subscribe(data => {
      this.data = data;
      this.productsArray = data.$values;
      console.log(this.productsArray)
      this.productsArray.forEach(x=>{
          console.log(x.ChildSimpleProducts)
      })
    })
 }

edited Apr 21, 2020 at 18:37

answered Apr 21, 2020 at 18:26

Cagri Tacyildiz

17.7k6 gold badges38 silver badges61 bronze badges

3 Comments

Peter Snee Over a year ago

@Çağrı, that part is already working, so i'm logging the the object but i want to get the child products exclusively and store them in a separate variable

Cagri Tacyildiz Over a year ago

Ahh sorry I understood wrongly. Then u can use foreach to enter each of nested result

anonymous Over a year ago

@Çağrı u r copying my answer. :(

rajratna maitry · Accepted Answer · 2020-04-21 18:48:36Z

0

Use load dash library to cloneDeep array https://lodash.com/docs/#cloneDeep

answered Apr 21, 2020 at 18:48

rajratna maitry

5084 silver badges11 bronze badges

Collectives™ on Stack Overflow

How do i get an object nested in another object using Angular

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related