Question

我是Ionic 2的新手，我在页面间传递数据时遇到了麻烦。在我的Home.ts文件中，我有一个全局数组，其中包含我计算的一些数字，我想将它传递给我的Table.ts文件，以便在带有* ngFor方法的HTML表格中显示它。

这是Home.ts中的函数，我填充数组并尝试推送（我将跳过计算，因为我知道它们是正确的。）

`import { Component } from '@angular/core';
 import { AlertController } from 'ionic-angular';
 import { IonicPage,NavController, NavParams} from 'ionic-angular';
 import {Table} from '../table/table';

 export class HomePage {

 averagesList: Array <number> =[];

 constructor(public alerCtrl: AlertController,
             public navCtrl: NavController,
             public navParams: NavParams)
             {}

 Calculate(){

 var Averages=[];

 //Calculations on the 'Averages' Array

 this.averagesList = Averages;


this.navCtrl.push(Table,this.averagesList);
 }

}

所以我尝试在我的Table.ts文件中打印它，但它给了我未定义的结果

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {HomePage} from '../home/home';
@IonicPage()
@Component({
selector: 'page-table',
templateUrl: 'table.html',
})
export class Table{


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

}

ionViewDidLoad() {

console.log(this.navParams.get('averagesList'));
}
}

我尝试传递一个let变量并且它有效，那么为什么它不适用于数组？

Answer 1

您可以使用服务来执行此操作。就像在angular2中一样，您可以在构造函数中导入服务并使用这样的属性。

import {OnInit} from '@angular/core';
import {someService} from ./somepath;
 ...
 export class someClass implements OnInit{
let myTmpVar; //we will capture the shared data in this variable
constructor (private smService: someService){ ... }
ngOnInit{ 
   this.myTmpVar = this.smService.SharedServiceData;
}
...
}

Answer 2

您的错误是使用console.log(this.navParams.get('averagesList'));

这里'averagesList'是关键。

为此，您需要发送：

this.navCtrl.push(Table,{'averagesList' : this.averagesList});

否则：

如果您直接发送

this.navCtrl.push(Table,this.averagesList);

您可以像这样检索值：

console.log(this.navParams.data);

Answer 3

最好使用服务传递嵌套数据。在你的案例计算对象。

您可以创建messageService并收听更改，如下所示。

pressure_hpa

可以在home.ts和table.ts页面中使用，如下所示

Home.ts

wind_speed_kt

Table.ts

wind_dir_degree

在离子2中的页面之间传递数组

3 个答案: