从服务器获取数据并将其传递到页面Angular

时间:2018-11-13 19:43:38

标签: angular firebase firebase-realtime-database ionic3 geofire

我有一个从离子应用程序中的api端点获取数据的服务。这是从服务器获取数据的功能。

getDriverInfo(username)
{
return this.http.get(this.base_url + 'user/' + username, {
  headers: new HttpHeaders().set('Authorization', 'Bearer ' + this.access_token)
});
}

我有一个获取数据响应的页面。

 handleResponse(data) {

  this.db.getDriverInfo(data.username).subscribe(
          resp => {
              this.driverData = resp;
              this.driverId = this.driverData.driver.id;
              this.driverUserid = this.driverData.id;
              console.log(this.driverData);
          }
  );
  this.token.handle(data.access_token);
  this.navCtrl.setRoot(HomePage, {
        driverData: this.driverData,
        driverId: this.driverId,
        driverUserId: this.driverUserId
  });
}

toDash()
{
let loading = this.loadCtrl.create({
  content:'Logging In...'
});

loading.present();

this.auth.login(this.form).subscribe(
 data => { 
   this.handleResponse(data);
    loading.dismiss();
 },
 error => { 
   this.handleError(error);
 loading.dismiss();
 }
);

}

console.log()this.driverData给了我数据。

在我的首页中,我尝试将数据保存在像这样的变量中

 constructor(public navCtrl: NavController, public platform: Platform,
          public geo: Geolocation, public loadingCtrl: LoadingController,
          public driverProvider: DriverProvider, public alertCtrl: AlertController,
          public navParams: NavParams, public modalCtrl: ModalController, public db: DbProvider
          ) {
            this.driverDetails = this.navParams.get('driver_data');
            this.driverUserId = this.navParams.get('driver_user_id');
            this.driverDBId = this.navParams.get('driver_id');
            this.isOnline = this.navParams.get('isOnline');
            console.log(this.driverDetails);
          }

但是console.log给了我未定义的信息。我如何有效地传递数据?

1 个答案:

答案 0 :(得分:1)

HomePage中更改以下内容:

this.driverDetails = this.navParams.get('driver_data');

对此:

 this.driverDetails = this.navParams.get('driverData');

将数据发送到第二页时,您使用的是属性driverData,因此,要接收此属性,您需要将其完全添加到get()

要获取所有数据,可以在构造函数中执行以下操作:

this.allData = this.navParams.data;
console.log(this.allData);

检查文档here以获得更多信息。