CODEWITHSUNDEEP
angulartypescriptionic2ionic3
Atif
Atif

Reputation: 51

Passing multiple navparam in ionic 2 from html

Hello I want to pass multiple data is their any way like

<button [navPush]="mainPage" [navParams]='data1+data2">Main Page </button>

Please help thanks

Upvotes: 1

Views: 2298

Answers (2)

sebaferreras
sebaferreras

Reputation: 44659

Since what you send in navParam is an object, so you can put there all the data:

import { MainPage } from './main';

@Component({
  ...
})
class MyPage {
  mainPage: any;
  params: Object;

  constructor(){
    this.mainPage = MainPage;
    this.params = { data1: 'foo', data2: 'bar' };
  }
}

And then use it in the view:

<button ion-button [navPush]="mainPage" [navParams]="params">Go</button>

Then you can get that information like this:

let data1 = navParams.get('data1'); // foo
let data2 = navParams.get('data2'); // bar

Even though you can define the object in the template just like you can see in @Yamin's answer, it's recommended to define it in the component code.

Upvotes: 2

Yamin
Yamin

Reputation: 3018

You can easily use an object with array:

<button [navPush]="mainPage" [navParams]='{data:[data1,data2]}">Main Page </button>

then access it like this:

navParams.get('data');

You can also set it like this:

<button [navPush]="mainPage" [navParams]='{data1:data1,data2:data2]}">Main Page </button>

And access them like:

navParams.get('data1');

Upvotes: 3

Related Questions