Service displaying page


I am migrating a Ionic 3 application to Ionic 4. In my code, I have a service called ViewerService. It contains a function that I need everywhere in my app. It consists to checking a lot of variables to see in what way I should display an element, and looks like that :

  providedIn: 'root'
export class ViewerService {
  constructor(..., private modalCtrl: ModalController) { }

  async openThing(pModeOpen: string = "root"): Promise<void> {
    // lots of code doing stuff
    if(pModeOpen == "root"){
        this.navCtrl.navigateForward(["", "page"])
    }else if(pModeOpen == "modal"){
      let profileModal = await this.modalCtrl.create({
        component: page,
        componentProps : { isModal: true }

It worked well in Ionic 3 but now I am struggling because I can’t import my page in this service. I learnt that it appears to be a bad design to display pages from service. But I was wondering, what should I do ? this function is very complicated (I simplified it for the example) and it is use it in several places in my code. I can’t repeat all that code everywhere and I don’t know where to place that function.

What design would be recommended for my situation ?