如何使用 navParams 获取整个对象 - Ionic 3 Angular 4

Question

目前我正在将数据对象从一个页面传递到另一个页面（在模态中）。

我有 8 个参数要传递给模态视图。

this.firstParam = navParams.get("firstPassed");
this.secondParam = navParams.get("secondPassed");
.
.
.
this.eightParam = navParams.get("eightPassed");

如何使用一次调用获取整个对象数据

this.data = navParams.getAll(); //something like this

我无法在文档中找到获取整个对象的方法。

Answer 1

你不需要那样做。您可以像下面一样一次发送所有内容。

注意：声明一个数据传输对象，如 DtoMy

Dto-my.ts

export class DtoMy {
    firstPassed: string;
    secondPassed: string;
    //your other properties
}

发送

let dtoMy = new DtoMy();
dtoMy.firstPassed= 'firstPassed';
dtoMy.secondPassed= 'secondPassed';
//your other values
const myModal = this.modalCtrl.create('MyModalPage', { data: dtoMy });
    myModal.onDidDismiss(data => { });
    myModal.present();

收到：

my-modal-page.ts

data :DtoMy;
constructor(private navParams: NavParams, private modalCtrl: ModalController) {
      this.data = this.navParams.get('data');
  }

Answer 2

为了能够在第二页中获取整个对象，您可以尝试以下操作：

要发送：

constructor(public navCtrl: NavController, public navParams : NavParams){}
 public userObject = 
 {
  firstName : "peter",
  lastName  : "haddad"
 }
clickMe()
{
  this.navCtrl.push(SecondPage,this.userObject);
}

导入 NavController 和 NavParams，然后使用方法push()，该方法将包含要传递的对象，它将导航到第二页。

在第二页中：

export class SecondPage 
{
 userObject;
 userName;
 constructor(public navCtrl: NavController, public navParams: NavParams){}
  ngOnInit()
  {
  this.userObject = this.navParams.data;
  this.userName   = this.userObject.firstName;
  console.log(this.userObject);
  }
}

在这里你可以通过使用NavParams的实例成员data来访问对象，为了能够访问lastName，你可以这样做this.lastName=this.userObject.lastName

Answer 3

constructor(public navCtrl: NavController, public navParams: NavParams) {
console.log(this.navParams.data)
}