如何在提供者和页面之间传递数据？

Question

我试图从谷歌地图提供商那里获取纬度和时间值并将它们传递给我的ListPage，但我无法使用NavController。

导入的navController：

import {NavController, NavParams} from 'ionic-angular';

导入ListPage：

import { ListPage } from '../pages/list/list';

构造

constructor(private navController: NavController, private navParams: NavParams)

代码：

 this.navController.push(ListPage, {
    lat: lat1, lon: lon1
});

一切看起来都不错，但我明白了

  

没有NavController的提供者

错误。

Answer 1

无法从NavController构造函数中调用@Injectable()。

1）从构造函数中删除private navController: NavController。

2）添加import { App } from 'ionic-angular';和

constructor(public connectivityService: Connectivity, public app: App)

3）添加此功能

get navCtrl(): NavController {
   return this.app.getActiveNav();
}

4）

this.navCtrl.push(ListPage, { lat: lat1, lon: lon1 });

5）在ListPage

constructor(public navParams: NavParams){
let lat = this.navParams.get('lat'); 
let lon = this.navParams.get('lon'); 
console.log(lat,lon); 
}

Answer 2

<强>更新

哎呀我没注意到你在使用服务。 Pablo Albaladejo是对的。您不能在服务中使用NavController，因为这可能会破坏导航堆栈或使其真正令人困惑。

走动的一种方法是按照Pablo的建议加载App。

另一种方法是使用Ionic提供的Events来在视图之间进行通信。我个人喜欢它，因为这给了我更多的自由，不把服务绑定到只有一个视图。

https://ionicframework.com/docs/api/util/Events/

<强>原始

你走在正确的道路上。您只需要导入NavParams

import { NavController, NavParams } from 'ionic-angular';

构造器：

constructor(private navController: NavController, private navParams: NavParams)

所以在您推动视图的情况下

this.navController.push(ListPage, {
    lat: lat1, lon: lon1
});

现在你可以访问参数：

this.lat = navParams.get('lat');
this.lot = navParams.get('lot');