Ionic 4如何从另一个页面获取数据

Question

我正在浏览页面并将数据发送到页面。 我想知道如何获取发送到页面的数据？ 。

示例：在ionic 3中，我们推送页面并发送数据，如下所示

this.navCtrl.push(Page, {x:x})

在其他页面上，我们从navParams获取日期，例如

this.navParams.get('x');

我需要知道如何在ionic 4中获取数据吗？ 我正在这样导航页面和数据

details(y){
 this.navCtrl.navigateForward('/packagedetails',{y:y});
}

Answer 1

您可以使用navigaionExtras实现此目的

第1页：

  let navigationExtras: NavigationExtras = {
          state: {
            x: x
          }
        };
        this.router.navigate(['details'], navigationExtras);

第2页：

  constructor(private route: ActivatedRoute, private router: Router) {
        this.route.queryParams.subscribe(params => {
          if (this.router.getCurrentNavigation().extras.state) {
            this.data = this.router.getCurrentNavigation().extras.state.x;
          }
        });
      }

Answer 2

他们有很多方法可以做到这一点。 这是三个：

第一

这是一个页面参数，另一个参数，但是如果用户关闭应用程序，则不会保存任何内容（不确定是否为100％，但是如果我记得很好，则不会）：

第1页：

import {Router} from "@angular/router" 

@Component(thingsThatIsIt)

export class Page1Page{
  constructor(private router: Router,OthersThingsInYourConstructor){thingsThatIsIt} 


  FunctionToGoOnPage2(someParameters) //someParameters is an JS object (like JSON for exemple)
  {
    this.router.navigate(["Page2",someParameters])
  }
}

第2页：

import {ActivatedRoute} from "@angular/router" 

@Component(thingsThatIsIt)

export class Page2Page{
  constructor(private route: ActivatedRoute,OthersThingsInYourConstructor)
  {
    this.route.params.subscribe(params => {
      console.log(params)
      FunctionThatDealWithParameters(params)
    })
  }




  FunctionThatDealWithParameters(someParameters) //someParameters is an JS object (like JSON for exemple)
  {
    //code to use your parameters
  }
}

第二

这是许多其他页面的一页，但是如果用户关闭应用程序，则不会保存任何内容：

提供服务： ionic generate service

在此服务中，创建一些属性以及一些get和set方法。

在需要服务的页面中，获取或设置方法，只需导入它，然后调用get / set方法（顺便说一句）

第三

这是许多页面的一页，并且即使用户关闭了他的应用程序，也保存了所有内容：

使用离子本地存储