2

我是一个绝对的初学者,并且是使用 Ionic3 自学的我有一个让我发疯的问题,我希望有人能提供帮助。

我有一个 master-detail-detail 设置,其中发生以下情况: Master page 有一个报告列表(取自 JSON 文件),单击该报告并进入详细信息页面,单击该报告并打开另一个页面有更多细节,而无需定义所有单独的部分。

我要做的只是将整个对象从第二页传递到第三页,以便我可以再次使用它的参数

母版页 (Report)、第二页 (Reportmenu)、第三页 (GenOverview)

因此,在主页面和第二页之间传递很好,并且可以使用 navparams(此处未显示)正常工作,但我想使用相同的对象并将所有数据再次传递到第三页。我认为这就像将它分配给一个新变量然后使用 navparams 再次传递它一样简单,但我得到未定义

export class ReportmenuPage {

name: any;
overallscore: any;
reportdate: any;
coach: any;
age: any;
TechOverall: any;
TactOverall: any;
PhysOverall: any;
PsychOverall: any;
Logo: any;
data2: any;

constructor(public navCtrl: NavController, public navParams: NavParams, 
public postsService: Posts, private toastCtrl: ToastController) {

this.overallscore = this.navParams.get('OverallScore');
this.reportdate = this.navParams.get('ReportDate');
this.name = this.navParams.get('Name');
this.coach = this.navParams.get('Coach');
this.age = this.navParams.get('Age');
this.TechOverall = this.navParams.get('TechOverall');
this.TactOverall = this.navParams.get('TactOverall');
this.PhysOverall = this.navParams.get('PhysOverall');
this.PsychOverall = this.navParams.get('PsychOverall');
this.Logo = this.navParams.get('Logo');
console.log(this.navParams.data);
this.data2 = this.navParams.data;


 }

 myClickHandlerOverview(data2) {
    this.navCtrl.push(GenOverviewPage, data2); 

所以这一切都很好,并给出了预期的输出所以我现在要做的就是把它放到 GenOverviewPage

  Here is the Reportmenu.html

      <ion-item (click)="myClickHandlerOverview(data2)" color="primary">
        <ion-icon name="arrow-dropright" item-end></ion-icon>
        GENERAL OVERVIEW
      </ion-item>

最后一点不起作用

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { ReportmenuPage } from '../reportmenu/reportmenu';


@IonicPage()
@Component({
  selector: 'page-gen-overview',
  templateUrl: 'gen-overview.html',
})
export class GenOverviewPage {

 constructor(public navCtrl: NavController, public navParams: NavParams) {

   let data3 = this.navParams.data;
   console.log(data3); //this shows as {}



  }

   ionViewDidLoad() {
   console.log('ionViewDidLoad GenOverviewPage');
 }

}

我很确定我会被嘲笑,因为我认为这与我对对象/数组以及它们如何传递缺乏理解有关,但我已经搜索过高低并且无法掌握我做错了什么。

以及为什么 console.log(data3) 显示第二个空数组,但如您所见,我可以在第 1 页和第 2 页之间很好地传输它

浏览器窗口图片

非常感谢

4

2 回答 2

3

在您的第二页中,您将数据保存在构造函数中包含的局部变量中。

let data2 = this.navParams.data;

您需要将其保存在要传递给您的myClickHandlerOverview. 将其更改为:

this.data2 = this.navParams.data;

还可能需要将数据类型从数组更改为对象或any.

 data2: any;

一种更好的方法似乎是将其存储在一个通用的提供程序中。

于 2018-02-06T10:37:40.997 回答
0

最后非常简单,多亏了 Suraj,我错过了这个!

myClickHandlerOverview(data2) {
   this.navCtrl.push(GenOverviewPage, this.data2); 
于 2018-02-06T11:23:09.203 回答