# \[closed\] Ion-list not work with 2 kind of object Json

**URL:** <https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364>\
**Category:** ionic-v3\
**Created:** [April 12, 2017, 11:19pm UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364 "2017-04-12T23:19:19Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![spigatl](https://avatars.discourse-cdn.com/v4/letter/s/3ec8ea/32.png) [@spigatl](https://forum.ionicframework.com/u/spigatl)\
**Post date:** [April 12, 2017, 11:19pm UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364/1 "2017-04-12T23:19:19Z")

</div>

**This is my JSON file…**

```
[
  {
    "title": "Erreichbarkeit",
    "items": [
      {
        "name": "1",
        "value": "a"
      },
      {
        "name": "2",
        "value": "b"
      },
      {
        "name": "3",
        "value": "c"
      }
    ]
  },
  {
    "title": "Erreichbarkeit 2",
    "items": [
      {
        "name": "1",
        "value": "g"
      },
      {
        "name": "2",
        "value": "f"
      },
      {
        "name": "3",
        "value": "e"
      }
    ]
  }
]

```

**this this my view.html - “this work”**

```
 <ion-list *ngFor="let data of posts">
    <ion-item>
      <ion-label> {{data.title}} </ion-label>
    </ion-item>
  </ion-list>

```

**but this one not work**

```
  <ion-list *ngFor="let data of posts.items">
    <ion-item>
      <ion-label> {{data.name}} | {{data.value}} </ion-label>
    </ion-item>
  </ion-list>
```

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [April 12, 2017, 11:21pm UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364/2 "2017-04-12T23:21:14Z")

</div>

Something seems to have gotten messed up in the code formatting, because `{{data.name}}` and `{{data.value}}` aren’t inside the code block, so we can’t see how you are intending to use them in the template.

---

<div class="post-metadata">

**Author:** ![spigatl](https://avatars.discourse-cdn.com/v4/letter/s/3ec8ea/32.png) [@spigatl](https://forum.ionicframework.com/u/spigatl)\
**Post date:** [April 12, 2017, 11:36pm UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364/3 "2017-04-12T23:36:37Z")

</div>

sorry i lost copy last code.

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [April 13, 2017, 1:23am UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364/4 "2017-04-13T01:23:09Z")

</div>

Please post how `posts` is populated. I suspect it is coming from an asynchronous source like an http request, in which case your best course of action is to prepopulate it in your page’s constructor to something like `posts = {items: []}`.

---

<div class="post-metadata">

**Author:** ![spigatl](https://avatars.discourse-cdn.com/v4/letter/s/3ec8ea/32.png) [@spigatl](https://forum.ionicframework.com/u/spigatl)\
**Post date:** [April 13, 2017, 2:35am UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364/5 "2017-04-13T02:35:15Z")

</div>

i try this… but nothing happens;

```
import { Component } from '@angular/core';

@Component({
  selector: 'agenda',
  templateUrl: 'agenda.html'
})

export class agenda {
  tudo: void;
  lista: any[];
    constructor() {

      this.tudo = this.getList();
      console.log(this.lista);
    }
    getList() {
      this.lista = [
  {
    "title": "Erreichbarkeit",
    "items": [
      {
        "name": "1",
        "value": "a"
      },
      {
        "name": "2",
        "value": "b"
      },
      {
        "name": "3",
        "value": "c"
      }
    ]
  },
  {
    "title": "Erreichbarkeit 2",
    "items": [
      {
        "name": "1",
        "value": "g"
      },
      {
        "name": "2",
        "value": "f"
      },
      {
        "name": "3",
        "value": "e"
      }
    ]
  }
]
    }
}
```

---

<div class="post-metadata">

**Author:** ![williamdelvalle](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/williamdelvalle/32/107869_2.png) [@williamdelvalle](https://forum.ionicframework.com/u/williamdelvalle)\
**Post date:** [April 13, 2017, 3:07am UTC](https://forum.ionicframework.com/t/closed-ion-list-not-work-with-2-kind-of-object-json/86364/6 "2017-04-13T03:07:39Z")

</div>

@spigatl Try this:

```
<ion-list>
  <ion-item-group *ngFor="let data of posts">
    <ion-item-divider>{{ data.title }}</ion-item-divider>
    
    <ion-item *ngFor="let item of data.items">
      <ion-label>{{ item.name }} | {{ item.value }}</ion-label>
    </ion-item>
  </ion-item-group>
</ion-list>
```