Создайте модальное окно в ионном режиме, но представьте его по-своему

Я хотел бы использовать Ionic modalController для создания модального окна из внешней страницы, но вместо вызова modal.present () я хотел бы присоединить созданный модальный компонент к значению y события панорамирования.

Эффект, который я хочу получить, - это перетаскивание пользователем модального окна вверх из ручки ящика, которая является нижним колонтитулом.

Ниже приведен урезанный код, это упрощенная версия, и я понимаю, что она неполная, но она служит для демонстрации того, что я хочу сделать для этого вопроса.

export class MyPage {

  myModal: any;

  constructor(public elementRef: ElementRef, public modalCtrl: ModalController) { }

  ngAfterViewInit() {

    let hammer = new window['Hammer'](this.elementRef.nativeElement);
    hammer.get('pan').set({ direction: window['Hammer'].DIRECTION_VERTICAL });

    hammer.on('panstart', (event) => {
      this.onPanstart(event);
    });

    hammer.on('pan', (event) => {
      this.onPan(event);
    });
  }

  onPanstart(event) {
    this.myModal = this.modalCtrl.create('MyModalPage');
  };

  onPan(event) {
    // This is where I am stuck...
    // Rather than calling modal present,
    // I want to allow the modal to be draggable.

    this.myModal.y = event.center.y;
  };
}

Существует этот отличный учебник Джоша Морони, который исследует, что я пытаюсь сделать, но решающее различие состоит в том, что мне нужно использовать модальную страницу для моей реализации и компонент ion-footer в качестве дескриптора ящика.

Я не уверен, как я могу использовать объект, возвращенный из ModalController.create (), или как применить css для позиционирования модального окна. Любая помощь очень ценится.