ionic 3 passing data to popover
Parameters/data can be passed to the Popover like this
let popover = this.popoverCtrl.create(PopoverPage, {key1:value1, key2: value2});
And then you can use NavParams
to retrieve the data passed to the Popover.
export class PopoverPage{
constructor(public navParams:NavParams) {
console.log(this.navParams.data);
let value1 = this.navParams.get('key1');
let value2 = this.navParams.get('key2');
}
}
For ionic v4, you can send data using componentProps
to pass data and retrieve through navParams.
const popover = await this.popoverController.create({
component: PopoverPage,
componentProps:{key1:value1, key2: value2}
});
return await popover.present()
You have to pass this.data as an json object, after then you can access the value with key.
Calling popup code:
presentPopover(myEvent){
//alert('invoke popup')
this.data = {data_key:'your_value'};
let popover = this.popoverCtrl.create(PopoverPage, this.data);
popover.present(
{
ev: myEvent
}
);
}
Accessing value from popover:
export class PopoverPage{
constructor(public viewCtrl: ViewController,public navParams:NavParams) {
// alert('in the popup');
//alert(this.navParams.get('data_key'));
}
}