What breaks angular binding in modals?

Ionic Framework
1

I encounter a strange behavior. My modal page is displayed like this

async presentModal() {
    const modal = await this.modalController.create({
        component: SavePage,
    });
    modal.onDidDismiss().then((data: any) => {
    });
    return await modal.present();
  }

It contains public variables displayed as labels in the page (buttons, etc.). But I get this:

Screenshot_6
Screenshot_6639×906 19.1 KB

If I place the calling code in another page all labels are displayed normally. I don’t know how it happened, it worked before and suddenly it broke without changing anything in the modal’s code. I tried calling a different modal and the result is the same so it appears to be to due to something in the parent page.
The label that is displayed is hard coded in the template.

2

Can you make an MCVE that is publicly available someplace like GitHub or GitLab?

3

The problem is this

<pinch-zoom>
</pinch-zoom>

I am using it for my map (with Openlayers).
Somehow the stopped displaying so I moved it out of the tags and left them with no content. That caused the modal windows in many parts of the whole app not being able to load variables.
Can you recommend me a different approach to zoom my map?