after I added tabs in my ionic application the navigation with params doesn't work properly , it goes to the page then it becomes empty this is my home.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { RemoteServiceProvider } from '../../providers/remote-service/remote-service';
import { DetailPostPage } from '../detail-post/detail-post';
import { AboutUsPage } from '../about-us/about-us';
import { ProfilePage } from '../profile/profile';
import { App } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
postList = [];
delaySpinner:any = 0;
app:App;
constructor(public navController : NavController , private remoteService : RemoteServiceProvider ){
this.getPosts();
}
getPosts(){
this.remoteService.getPosts().subscribe((data)=>{
this.postList = data;
this.delaySpinner = 1;
});
}
PostDetail(id:number){
this.navController.push(DetailPostPage, {id:id});
console.log("testNavigation",id);
}
ionViewDidLoad() {
}
}
this is my home.html
<!--home.html-->
<ion-header>
<ion-navbar color = "primary">
<button ion-button icon-only menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
<h2>Posts</h2>
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-spinner name="circles" *ngIf="delaySpinner == 0"></ion-spinner>
<ion-list>
<ion-item *ngFor="let post of postList" >
<ion-thumbnail item-start>
<img src="https://cdn.pixabay.com/photo/2016/08/08/09/17/avatar-1577909_1280.png">
</ion-thumbnail>
<h2>{{ post.title }}</h2>
<p>{{ post.body }}</p>
<button ion-button clear item-end (click)="PostDetail( post.id )">View</button>
</ion-item>
</ion-list>
</ion-content>
this is my tabs.html
<!--tabs.html-->
<ion-tabs>
<ion-tab [root] = "homePage" tabTitle = "About us" tabIcon = "book"></ion-tab>
<ion-tab [root] = "profilePage" tabTitle = "Profile" tabIcon = "star"></ion-tab>
<ion-tab [root] = "aboutPage" tabTitle = "About us" tabIcon = "book"></ion-tab>
</ion-tabs>
it looks that the problem is with "this.navController.push(DetailPostPage, {id:id});" we should have an other method to navigate when we have a tabs and params