Question

在我的离子应用程序中添加选项卡后，使用params的导航无法正常工作，它会转到页面然后变为空这是我的家。

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() {

  }
}

这是我的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>

这是我的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>

它看起来问题出在＆＃34; this.navController.push（DetailPostPage，{id：id}）;＆＃34; 当我们有标签和参数时，我们应该有另一种方法来导航

如何使用params在离子片外面进行nav.push？

0 个答案: