Ionic 2 中的导航参数答案

【问题标题】：NavParams in Ionic 2Ionic 2 中的导航参数
【发布时间】：2017-09-14 08:56:16
【问题描述】：

我正在尝试使用 NavParams 将特定数据从一个页面传递/获取到另一个页面，但我总是在控制台中得到 undefined 结果。我不知道似乎是什么问题。这是我的代码：

order.ts（我要获取数据的TS文件）

postOrder(ordernum) {

        let headers = new Headers();
        headers.append('Content-Type', 'application/json');

        let data=JSON.stringify({
                              mode_code: this.data2code,
                              order_totalpayment: this.dataquantity,
                              order_status: this.status
                            });

      this.http.post('http://<--My JSON API-->/xxx/api.php/ordered?transform=1',data,headers)
      .map(res => res.json())
      .subscribe(res => {
      console.log("Success Order No.: "+res);
      this.ordernum = res;

          let data2=JSON.stringify({
                                  order_no: this.ordernum,
                                  prod_id: this.dataid,
                                  order_subtotal: this.dataquantity
                                });

          this.http.post('http://xxxx/xxx/api.php/order_list?transform=1',data2,headers)
          .map(resp => resp.json())
          .subscribe(resp => {
          console.log("Order List No.: "+resp);

          this.nav.setRoot(ConfirmorderPage, { ordernum: ordernum });

          }, (err) => {
          this.showPopup("Oops!", "Something went wrong.");
          });

      }, (err) => {
      this.showPopup("Oops!", "Something went wrong.");
      });

  }

在代码中，我想要得到的是this.ordernum 数据。所以我使用这个代码：postOrder(ordernum)this.nav.setRoot(ConfirmorderPage, { ordernum: ordernum });

order.html（我将数据传递到另一个页面的 HTML 文件）

<div">
    <div padding>

      <p>Your Order Number is {{ordernum}}</p>

    </div>
  </div>

  <div style="margin: 10px;">
    <button ion-button block color="orange" (click)="postOrder(ordernum)" >Place Order</button>
  </div>
  </div>

我想要的数据是ordernum所以我把它放在点击函数(click)="postOrder(ordernum)"

confirmorder.ts（我想从订单页面传递数据ordernum的TS文件）

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

  this.order = this.navParams.get('ordernum');
  console.log(this.order);

}

我使用this.navParams.get('ordernum') 从订单页面获取数据，然后我将ordernum 数据传递给this.order 变量，但是当我尝试在控制台中显示它时，我得到了未定义的结果。我不知道我的代码有什么问题。希望你们能帮助我。提前谢谢你。

【问题讨论】：

标签： javascript angular ionic2 navparams

【解决方案1】：

this.nav.setRoot(ConfirmorderPage, { ordernum: ordernum }); 在您的对象中，键和值都是变量ordernum 的值。您的密钥必须是字符串，因此请使用引号。

还使用this 来确保您指向正确的变量（您似乎有一个类变量以及一个名为ordernum 的参数？）。

做：

this.nav.setRoot(ConfirmorderPage, { 'ordernum': this.ordernum });

【讨论】：