2016-10-26 4 views
1

В приложениях, где есть массив, а с ним еще 7 массивов, я не могу показать его в шаблоне. Может кто-нибудь, пожалуйста, скажите мне, как получить массивы от json?Как получить массивы из .json Ionic 2 Angular 2

Спасибо всем!

channel.json, пришедший с именем channel:

{ 
    "version": 3.1, 
    "get": true, 
    "programms1": [ 
    { 
     "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ], 
    "programms2": [ 
    { 
      "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ], 
    "programms3": [ 
    { 
      "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ], 
    "programms4": [ 
    { 
      "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ], 
    "programms5": [ 
    { 
      "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ], 
    "programms6": [ 
    { 
      "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ], 
    "programms7": [ 
    { 
      "id": 1, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 2, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    }, 
    { 
     "id": 3, 
     "img": "image.png", 
     "name": "name", 
     "about": "about" 
    } 
    ] 
} 

Ионные шаблон:

<ion-list> 
    <ion-item *ngIf="let channel channel.programms7">  
    <ion-icon name="play" item-left large></ion-icon> 
    <h2>{{channel.name}}</h2> 
    <p>{{channel.about}}</p> 
    </ion-item> 
<ion-list 

Пожалуйста, покажите мне пример того, как напечатать массив в шаблоне.

Заранее благодарен!

+0

В чем вопрос? Вы не знаете, как читать json-файл? как его закодировать в шаблоне или? – Sefa

+0

да! i can not read json; ( –

+0

Вам необходимо позвонить в ваш файл. См. ответ здесь http://stackoverflow.com/questions/36749153/how-to-i-load-json-data-into-angular2-component – Sefa

ответ

1

Вы можете перебирать массив в шаблон, используя ngFor директиву:

<div *ngFor="let j of myJson.programms3"> 
    {{j.id}} 
    {{j.img}} 
    {{j.name}} 
    {{j.about}} 
</div> 

Вот working Plunker.

Смежные вопросы