How to read Object in ionic 2?

Ionic Framework ionic-v3
1

I am trying to fetch a object in ionic2 which has key value and i want to read the key and the brand name from it within ionic2.

{
    "status": "success",
    "products": {
        "Key1": [
            {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }
        ],
        "Key2": [
            {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }
        ],
        "Key3": [
            {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }
        ],
    }
}
2

I don’t know if I have understand what you need. Your problem is to fetch the data form a server (you can use the Http module) or to read/parse this data?

In the second case, it’s an javascript issue, not related to Ionic.
You can do something like:

let products = data.products; //data is the json from the example
Object.keys(products).forEach(key => {
  console.log(key); //Key1, Key2, Key3
  console.log(products[key][0].brand) //brandname
});
3

@chrisbenseler Exactly in the second case, i want to read the key and the brand name dynamically so how i can do this ? thank you.

4

Let’s say for example, this value is from a json file or from the server and this comes from a variable name “result”

you can then read the key and brand name through

5

@Ellezo i’ve got brandName-> undefined .

6

Updated my answer. Kindly check it.

7

ok thank you it’s working but another question in a new case

{
    "status": "success",
    "products": {
        "Key1": [
            {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }, {
              "entity_id": "4438",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }
        ],
        "Key2": [
            {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            },
 {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }
        ],
        "Key3": [
            {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            },
 {
              "entity_id": "448",
              "sku": "587",
              "name": "name",
              "image_url": "587.png",
              "price": "15,000",
              "qty": 0,
              "rating": 0,
              "wishlist": false,
              "specialprice": "7,500",
              "brand": "brandname"
            }
        ],
    }
}
8

So what’s the question? Same code can be applied in the new result data.

9

i want to get some data but in the new result data like above , thank you in advanced.

10
11

To print "Key" array in *ngFor loop, first write one Pipes

Pipe.ts

import { Component,Pipe, PipeTransform, Injectable } from '@angular/core';

@Pipe({
  name: 'objectValues'
})

@Injectable()
export class ObjectValuesPipe implements PipeTransform {
  transform(obj: any) {
    let result = [];
    for (var key in obj) {
      if (obj.hasOwnProperty(key)) {
        result.push(obj[key]);
      }
    }
    return result;
  }
}

do not forget to import your Pipes in @NgModule, than you can use this pipe like this.

<ul*ngFor="let item of items">
   <li*ngFor="let value of item | objectValues">
     {{ value }}
   </li>
 </ul>