Passing data to a component from ModalController.create()

user_14839305 0
Viewed 304

Is there a way that I can pass this itemId parameter so that the MarketPlaceItemPage can use that data?

async presentMarketplaceItem(itemId: number) {
    const modal = await this.modalController.create({
      component: MarketplaceItemPage,
      cssClass: '',
      mode: 'ios',
    });
    return await modal.present();
  }

I'm just not finding what I need in the Ionic documentation. Thanks in advance!

ionic-framework angular typescript
2 Answers

I found something that works from this website https://www.freakyjolly.com/ionic-modal-popovers-pass-receive-data/

async presentMarketplaceItem(itemId: number) {
    const modal = await this.modalController.create({
      component: MarketplaceItemPage,
      componentProps:{
        id: itemId
      },
      cssClass: '',
      mode: 'ios',
    });
    return await modal.present();
  }
user_148393050

Here is the official documentation from Ionic

The property you are looking for is componentProps. Ionic controllers are not listed in their v5 documentation but their were listed under v4.

Another way (faster IMO) is to directly browse sources (ctrl+click), it will show you the controller method signature.

user_163918980
Related