Ion-loading right from the start

Ionic Framework
1

I was wondering if it is possible to start a page with ion-loading element loading right from the start. I’ve tried to create the component at ngOnInit the after an if check and navigateByUrl method provided by router, dismiss the loading element, but not only the ion-loading delay to be shown but also it doesn’t dismiss when navigation is completed. I also tried to make ngOnInit an async function to no avail.

ngOnInit() { 
      this.loadingCtrl.create({
        message: 'Aguarde...',
        translucent: true,
      }).then(el => {
        el.present();
      });

      const userData = new AuthResponseData(
        this.route.snapshot.queryParamMap.get('localId'),
        parseInt(this.route.snapshot.queryParamMap.get('expiresIn')),
        this.route.snapshot.queryParamMap.get('accessToken'),
        this.route.snapshot.queryParamMap.get('refreshToken')
      );
      this.authService.setUserData(userData);
      this.router.navigateByUrl('/usuario/painel').then(
        result => {
          this.loadingCtrl.dismiss();
        }
      );

Any insights on this matter?

2

Can you please reproduce this on stackblitz?