Passing tabs NavParams to tab

Ionic Framework ionic-v3
21

So you would have a service as below :

// Require framework
import {Injectable} from "angular2/core";

@Injectable()
export class Params {
  public params;

  constructor () {
    this.params = {};
  }
}

That Service would then be added to the app.ts file as below :

// Import services
import {Params} from "./services/params/params";

@App({
  template: "<ion-nav [root]='root'></ion-nav>",
  config: {}, 
  providers: [Params]
})

Note that the Params service is added to providers within @App

Then you just inject the service into the constructor of the class you need it in. Just add as below

import {Params} from "../../services/params/params";

@Page({
  templateUrl: "build/pages/path/to/view.html"
})
export class EventsPage {
  public params: Params;

  constructor(params: Params) {
    this.params = params;
  }
}
22

Thks @jamesbyrne for ur help.

How to send data to Params Service in my case ?

`doLogin() {
      this.userService.userLogin(this.email, this.password)
          .subscribe( 
                 data => {
                         this.user = data; // how to send this data to Params service ??
                         console.log('Account Login with Success', this.user);
                         this.nav.setRoot(UserPage, this.user);                       
                         },
                 error =>  this.errorMessage = <any>error);
} // end of doLogin()`

Thanks.

23

I was able to successfully implement this using the rootParams attribute that they just added in February (specifically for this case, from what I can tell). Check out a more detailed answer here: http://stackoverflow.com/a/36318249/352246.

I felt the documentation for rootParams was a little misleading and there is no code example (yet), but you can see it referenced in the docs here: http://ionicframework.com/docs/v2/api/components/tabs/Tab/.

24

Hi lawlesscreation.

In the view (.html), pass the params like that:

And then in your Tab1.ts you have to receive the params like usually:

constructor(params: NavParams){
params = params.data;
}

Greetings