Running a function before a .present() promise is resolved


I am trying to add a custom CSS class to a modal so that it will have different css positioning when it is shown/presented.

I have done this partially by doing this:

modal.present().then(() => {
    let ele = modal.pageRef().nativeElement;
    this.renderer.setElementClass(ele, 'custom-class', true);

There is a drawback though, it’s that modal.pageRef().nativeElement is only defined once the modal’s .present() promise is resolved. This promise is resolved after the modal show transition is completed.

Is there any way to run a custom function and get the nativeElement right when the modal is added to the DOM and not after the transition?