Ionic 4 dismissOnPageChange

Ionic Framework
1

Hi to Everybody,

I’m trying to use LoadingController on Ionic 4. The option ‘dismissOnPageChange’ seems not working. Is there anybody facing this problem and finding a solution?

1 Like
2

Ionic info aka which beta are you using? I reckon something like this but it was fixed some beta ago

3

Ionic Version is 4.1.2

4

that’s the cli version not the ionic (angular) one

run ionic info and parse your result
also would help to display your code

5

Sorry. Below is what you are asking for:
Ionic Framework : @ionic/angular 4.0.0-beta.3

6

try to upgrade to the last version (currently beta.8)

7

Which is the best way to update ionic?

8

I upgraded but still not working. I really get rid of Ionic 4 problems on this project. I tried to use HttpClient to make post request. I faced CORS problem. I am thinking if I made a mistake to use Ionic 4 on my project.

9

I’m not sure if you are not mixing a lot of information and version in the same post, I’ve to say I don’t follow. Maybe someone else will be more clever than me then

10

There is no confusion.
Now my ionic version is:
Ionic Framework : @ionic/angular 4.0.0-beta.8

I can’t use dismissOnPageChange still.

11

Now I am getting the error below:

Argument of type ‘{ content: string; showBackdrop: false; }’ is not assignable to parameter of type ‘LoadingOptions’.

12

oki doki

so found that:

Loading

dismissOnPageChange was removed. Fortunatelly all the navigation API is promise based and there are global events (ionNavWillChange) you can listen in order to detect when navigation occurs.

You should take advantage of these APIs in order to dismiss your loading overlay explicitally.

source: https://github.com/ionic-team/ionic/blob/5f3c7cd755d2a9c0b6cabf6c0900168421c1e082/angular/BREAKING.md

Means I was wrong this wasn’t solved, it doesn’t exist anymore. I guess in the meantime I just changed my code during my migration and that’s why I thought if was good

So for example if you use a loadingController while navigating

async navigate() {
  const loading = await this.loadingController.create({});
  
  await loading.present();
  
  await this.navController.navigateForward('/your-route');
  
  await loading.dimiss();
}
1 Like
13

see https://github.com/ionic-team/ionic/blob/cc960c3d483116ec774ba3fcf12b764d9f0f8cd5/core/src/components/loading/loading-interface.ts

content => message

14

Thank you for your valuable help.

1 Like
15

no worries my pleasure, have fun coding :wink:

16

Last question: To use HTMLIonLoadingElement, what do I have to import?

17

HTMLIonLoadingElement isn’t actually exposed yet, you could ignore that part

I have edited my above code respectively I have removed that definition

18

How can I set HTML inside “message” option? As we had before with the “content” option.

19

In a loading? The doc is there for you: https://ionicframework.com/docs/api/loading

20

Thanks, but I read the doc, I was wondering if there is somehow a hack to use content as we used to do before. As seen in docs there is no “content” anymore.