JSON local

@bartlo wrote:

How can I get the code I used to have in Ionic 3 to work? I could consult a JSON and pass it to a list, now it’s no longer useful

import { Component } from ‘@angular/core’;
import { IonicPage, NavController} from ‘ionic-angular’;
import { Http } from ‘@angular/http’;
import ‘rxjs/add/operator/map’

@IonicPage({
name:“BC”
})
@Component({
selector: ‘page-bc’,
templateUrl: ‘belen-bc.html’,
})
export class BPHPage {
information:any;
constructor(public navCtrl: NavController, private http: Http) {
let localData = http.get(‘assets/json/our.json’).map(res => res.json().items);
localData.subscribe(data => {
this.information = data;
})
}
toggleSection(i) {
this.information[i].open = !this.information[i].open;
}

toggleItem(i, j) {
  this.information[i].children[j].open = !this.information[i].children[j].open;

  }
}

And the HTML

<button  class="ruta" ion-button round  color= "danger" (click)="ir_mapabelen()">Ver Ruta</button>


<p align ="Center"><b>Toca la estación para desplegar Horario</b></p>
<ion-list-header *ngFor="let item of information; let i = index" no-lines no-padding>

    <button ion-item (click)="toggleSection(i)" detail-none [ngClass]="{'section-active': item.open, 'section': !item.open}">
      <ion-icon item-left name="arrow-forward" *ngIf="!item.open"></ion-icon>
      <ion-icon item-left name="arrow-down" *ngIf="item.open"></ion-icon>
        {{ item.name }}
    </button>

    <ion-list *ngIf="item.children && item.open" no-lines>

      <ion-list-header *ngFor="let child of item.children; let j = index" no-padding>

        <button ion-item (click)="toggleItem(i, j)" *ngIf="child.children" class="child" detail-none>
          <ion-icon item-left name="add" *ngIf="!child.open"></ion-icon>
          <ion-icon item-left name="close" *ngIf="child.open"></ion-icon>
          {{ child.name }}
        </button>


        <ion-item *ngIf="!child.children" ion-item detail-none class="child-item" text-wrap>
          <h2>{{ child.name }}</h2>
          <p><b>{{ child.information }}</b></p>

        </ion-item>

        <ion-list *ngIf="child.children && child.open">

          <ion-item *ngFor="let item of child.children; let k = index" detail-none class="child-item" text-wrap>
            <h2>{{ item.name }}</h2>
            <p>{{ item.information }}</p>

          </ion-item>
        </ion-list>

      </ion-list-header>
    </ion-list>

  </ion-list-header>
</ion-list>

Posts: 1

Participants: 1

Read full topic