user1998013 user1998013 - 2 months ago 30
TypeScript Question

how to add a dynamic button using navparams in ionic 2

I am building an app in Ionic 2, I am using navparams tu grab the button pressed when pushing another page.
In this page I have a link that I want to generate dynamically using the params passed depending the buton pressed in the previous page.

So, I have homepage with button1, button2, button3.
I
In homepage I have this code:

goToPage(){
this.navCtrl.push(Page,{
firstPassed: "param1"
});
}


Then in the next Page I have:

export class Page {
public firstParam:any;
constructor(public navCtrl: NavController, params: NavParams) {
this.firstParam = params.get("parampassed");
}


If I add in the page.html:

<ion-title>{{firstParam}}</ion-title>


I get the params well, but what I want is to use that param as a link in a button, something like this in the page.ts:

goToPage2(){
this.navCtrl.push(page'parampassed');
}


So it could take me to the page pageparam1.html

How can I do it?

Thank you

Answer

create seperate pages (including .ts files) for Page 1, Page 2 and Page 3

Next import these in your 'NextPage'

make a button <button (click)="goToPageWithParam()">Go to param page</button>

Now in your NextPage create this function:

goToPageWithParam(){
    let page:any;
    if(this.firstParam() == "button1"){
        page = Page1;
    }
    if(this.firstParam() == "button2"){
        page = Page2;
    }

    //etc..
    //then at the end
    this.navCtrl.push(page);
}

I think this is a solution to your problem