ionic 4 - как получить данные, переданные модальному

Question

Согласно документам Ionic 4 вы можете передавать данные через свойство componentProps.В Ionic3 я могу получить его с помощью службы navParams.Как мне сделать это в Ionic 4?

async presentModal() {
    const modal = await this.modalController.create({
      component: ModalPage,
      componentProps: { value: 123 }
    });
    return await modal.present();
  }

Answer 1

Navparams по-прежнему работает в Ionic 4 Beta-15

Page1.ts

   import { ModalPage } from './modal.page';

   async presentModal() {
    const modal = await this.modalController.create({
      component: ModalPage,
      componentProps: { value: 123 }
    });

    //insert onDidDismiss() here

    return await modal.present();
   }

ModalPage.ts

import { NavParams } from '@ionic/angular';

  export class ModalPage {
  public value = this.navParams.get('value');

  constructor(private navParams: NavParams) {}

}

Чтобы получить возвращаемое значение из ModaPage в Page1:

Page1.ts

modal.onDidDismiss().then((data) => {
  console.log(data);
})

ВАЖНО:

1. Для использования ModalPage внутри Page1 вам необходимо импортировать ModalPageModule модуль внутри page1.module.ts файла.

Answer 2

Вам необходимо использовать декоратор @Input ().

async presentModal() {
    const modal = await this.modalController.create({
      component: ModalPage,
      componentProps: { value: 123 }
    });
    return await modal.present();
  }

Компонент:

@Component({
  selector: 'ModalPage',
  templateUrl: './ModalPage.component.html',
  styleUrls: [ './ModalPage.component.css' ]
})
export class ModalPage  {
  name = 'Angular';
  @Input() value: any;
}