Uncaught (in promise)

Saenz · June 29, 2018, 5:38pm

Hola a todos, espero anden muy bien, les comento mi problema, quiero utilizar una lista que tengo en una pagina llamada Primera-A en otra q se llama equipos, me gustaria que la lista se genere de forma dinamica y poder mostrar la informacion en la pagina equipos segun que boton haya presionado en la pagina Primera-A, me tira el siguiente error:

Les comparto los 2 archivos html y ts.

Primera-A Html

Primera - A

<ion-segment [(ngModel)]="PrimeraA">
    <ion-segment-button value="Equipos">
      Equipos
    </ion-segment-button>
    <ion-segment-button value="Posiciones">
      Posiciones
    </ion-segment-button>
    <ion-segment-button value="Goleadores">
      Goleadores
    </ion-segment-button>
    <ion-segment-button value="Fixture">
      Fixture
    </ion-segment-button>
</ion-segment>

<div [ngSwitch]="PrimeraA">
    <ion-list *ngSwitchCase="'Equipos'">
            <ion-item *ngFor="let equipo of equiposPA"(click)="abrirEquipo()">
              <img [src]="equipo.imagen" item-left>
              <h3>{{equipo.nombre}}</h3>
              <p small>{{equipo.localidad}}</p>
            </ion-item>        
    </ion-list>
  
    <ion-list *ngSwitchCase="'Posiciones'">
      <ion-item>
        <h2>Posiciones</h2>
      </ion-item>
      ...
    </ion-list>

    <ion-list *ngSwitchCase="'Goleadores'">
        <ion-item>
          <h2>Goleadores</h2>
        </ion-item>
        ...
    </ion-list>

    <ion-list *ngSwitchCase="'Fixture'">
        <ion-item>
          <h2>Fixture</h2>
        </ion-item>
        ...
    </ion-list>
  </div>

Primera-A ts

import { Component } from ‘@angular/core’;
import { IonicPage, NavController, NavParams, MenuController } from ‘ionic-angular’;
import { EquiposPage } from ‘…/equipos/equipos’;

@IonicPage()
@Component({
selector: ‘page-primera-a’,
templateUrl: ‘primera-a.html’,
})
export class PrimeraAPage {

equiposPA:any [] = [
{
nombre:“Complejo Deportivo”,
localidad:“Justiniano Posse”,
imagen:“assets/imgs/complejo.png”
},
{
nombre:“San Martin”,
localidad:“Monte Buey”,
imagen:“assets/imgs/sanmartin.png”
},
{
nombre:“Defensores de Juventud”,
localidad:“Justiniano Posse”,
imagen:“assets/imgs/defensores.png”
},
{
nombre:“Matienzo”,
localidad:“Monte Buey”,
imagen:“assets/imgs/matienzo.png”
}
];

constructor(public navCtrl: NavController, public navParams: NavParams, private menuCtrl: MenuController) {

}

ionViewDidLoad() {
console.log(‘ionViewDidLoad PrimeraAPage’);
}

mostrarMenuLateral()
{
this.menuCtrl.toggle();
}
abrirEquipo(equipo)
{
this.navCtrl.push(EquiposPage, { equipo: equipo });
}
}

Equipo html

Equipos

Equipo ts

import { Component } from ‘@angular/core’;
import { IonicPage, NavController, NavParams } from ‘ionic-angular’;

@IonicPage()
@Component({
selector: ‘page-equipos’,
templateUrl: ‘equipos.html’,
})
export class EquiposPage {

item;
constructor(public navCtrl: NavController, public navParams: NavParams) {

this.item = navParams.data.equipo;

}

ionViewDidLoad() {
console.log(‘ionViewDidLoad EquiposPage’);
}

}

Desde ya muchas gracias y espero puedan ayudarme!

Saludos

anna_liebt · June 29, 2018, 9:45pm

Hello,

the error means that whatever from whatever.nombre does not exit or not exist at that time.

If I understood it correct, than in Primer-A it works and in Equipo it fails.

Maybe

(click)="abrirEquipo()"

and

abrirEquipo(equipo)
{
this.navCtrl.push(EquiposPage, { equipo: equipo });
}

does not match.

Best regards, anna-liebt

Uncaught (in promise)

{{item.nombre}}