NavParams in Ionic 2

Question

I am trying to pass/get a specific data from one page to another page using NavParams but I always get undefined result in the console. I do not know what seems to be the problem. Here is my code:

order.ts (TS file where I want to get the data)

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.");
      });

  }

In the code, what I am trying to get is the this.ordernum data. So that I use this codes: postOrder(ordernum) this.nav.setRoot(ConfirmorderPage, { ordernum: ordernum });

order.html (HTML file in where I did pass the data to another page)

<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>

the data I wanted was the ordernum so that I put it in the click function (click)="postOrder(ordernum)"

confirmorder.ts (TS file where I want to pass the data ordernum from the orderpage)

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

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

}

I used this.navParams.get('ordernum') to get the data from the orderpage and I pass the ordernum data to the this.order variable but when I tried to show it in the console, I am getting undefined result. I have no idea what is wrong with my code. Hope you guys can help me. Thank you in advance.

Answer 1

this.nav.setRoot(ConfirmorderPage, { ordernum: ordernum }); Here in your object, both key and value are the value of variable ordernum. Your key needs to be a string so use quotes.

Also use this to ensure you point to the correct variable (you seem to have a class variable as well as a parameter of name ordernum?).

Do:

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