Cannot read property 'push' of undefined Ionic V3

Ionic Framework ionic-v3
1

Hello everybody. I am just trying to make a push to another page but i get the error: Cannot read property ‘push’ of undefined and i don’t know how to solve it. I read diferent posts but it doesnt work.

The method (getCategoriasPrincipales()) returns well every category, i can see it in the menu.

Param1: is well recieved from another page like this
this.paramCatId = navParams.get(‘param1’);

Thanks a lot!

App.html

  <button menuClose ion-item class="fuente_negrita" *ngFor="let cat of categoriaDestacada" (click)="productosCategoria2(cat.categoriaId)">
    {{cat.categoriaNombre}}
  </button>

<ion-nav [root]=“rootPage” #content>

app.component.ts

import { Component, ViewChild } from ‘@angular/core’;
import { Platform, Nav } from ‘ionic-angular’;
import { Http } from ‘@angular/http’;
import { StatusBar } from ‘@ionic-native/status-bar’;
import { SplashScreen } from ‘@ionic-native/splash-screen’;
import { ProductosCategoriaPage } from ‘…/pages/productos-categoria/productos-categoria’;

import { HomePage } from ‘…/pages/home/home’;
@Component({
template: ‘<ion-nav #myNav [root]=“rootPage”>’,
templateUrl: ‘app.html’
})
export class MyApp {
@ViewChild(‘Nav’) nav: Nav;
rootPage:any = HomePage;
empresa = 1;
categoriaDestacada: any;

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, public http: Http) {
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
statusBar.styleDefault();
splashScreen.hide();
});
this.getCategoriasPrincipales();
}

getCategoriasPrincipales(){
this.http.get(“http://…file.php?emp=”+this.empresa).subscribe( data => {
this.categoriaDestacada = JSON.parse(data["_body"]);
}, err =>{
console.log(err);
});
}

productosCategoria2(elemento){
this.nav.push(ProductosCategoriaPage, {param1: elemento});
}
}

2

Hi @carvear :wave:

The error is coming from this line:

this.nav.push(ProductosCategoriaPage, {param1: elemento});

The nav property is defined as @ViewChild(‘Nav’) nav: Nav; but there isn’t any component with this name ('Nav') so its value is undefined when this line tries to use it.

You can either use @ViewChild(Nav) (passing the component’s class instead of a string) or it’s id, like @ViewChild('content').

Best,
Rodrigo