离子3页之间的参数

Question

我有一个带有用户名的简单页面。该用户有一个带有他的ID的按钮，当单击时，我们转到另一个页面，显示有关此用户的更多详细信息。问题是我不能将参数传递到第二页。

我在第一页中有此代码。

export class VisitasPage {
  public data: any;
  public data2: any;
  constructor(public navCtrl: NavController, public visitas: VisitasServiceProvider) {
    this.verVisitas();
  }
  verVisitas(){
    this.visitas.Visitas()
    .then(data => {
      this.data = data;
    });
  }
  verDetalles(id:any){
    this.visitas.verVisita(id)
    .then(data2 => {
      this.data2 = Array(data2);
    });
    this.navCtrl.push(DatosPage, {
      animate: true,
      data:this.data2
    });
  }

当我将{{data}}放在第二页的console.log（）中时，显示不确定并且应该具有数组。�有帮助吗？

Answer 1

i不，您如何在详细信息中获得该值，但是从一个页面发送和接收数据的正确方法就像您可以在中看到此stackblitz项目。

首页

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { DetailsPage } from '../../pages/details/details';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  public ids = [1,2,3,4,5];
  constructor(public navCtrl: NavController) {}
  public onOpenDetails(): void {
    this.navCtrl.push(DetailsPage, { data: this.ids});
  }
}

详细信息Spage

import { Component } from '@angular/core';
import { NavParams } from 'ionic-angular';
@Component({
  selector: 'page-details',
  templateUrl: 'details.html'
})
export class DetailsPage {
  public dataIds: Array<number>;
  constructor(public navParams: NavParams) {
    this.dataIds = this.navParams.get('data');
  }
}