Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

118
Vistas
IONIC 5 Cómo recargar la página sin pantalla blanca

Cuando lo implementé en la aplicación IONIC 5, mi problema era que cada vez que recargaba la página, mostraba la rueda giratoria y la imagen que había configurado, pero después de que la rueda giratoria se recargaba por completo, la aplicación mostraba una pantalla blanca de 1 a 2 segundos y luego solo mostrar la página que quería.

Entonces, mi pregunta es ¿cómo puedo recargar la página sin que se muestre la pantalla blanca?

Configuré los códigos a continuación en mi app.component.html, por lo que cada vez que mi aplicación vuelva a cargar la página, mostrará la rueda giratoria y la imagen.

 <ion-app> <ion-router-outlet></ion-router-outlet> <div class="loading-overlay" *ngIf="loading" style="margin: auto;"> <img src="assets/icon/favicon.png"style="height:150px;width:150px;"/> <br/> <!-- Bubbles Spinner --> <ion-spinner name="bubbles"></ion-spinner>&nbsp; <span>Please Wait..</span> </div> </ion-app>

la función en mi app.component.ts

 constructor(private router: Router, private so: ScreenOrientation, private alertCtrl: AlertController, private platform: Platform, private _location: Location, ) { this.router.events.subscribe((e : RouterEvent) => { this.navigationInterceptor(e); }) this.router.events.subscribe((event) => { if (event instanceof NavigationEnd) { this.history.push(event.urlAfterRedirects) } }) //Updated Code this.platform.ready().then(() => { setTimeout(function(){ this.splashScreen.hide(); }, 50); }); } // Shows and hides the loading spinner during RouterEvent changes navigationInterceptor(event: RouterEvent): void { if (event instanceof NavigationStart) { this.loading = true } if (event instanceof NavigationEnd) { this.loading = false } // Set loading state to false in both of the below events to hide the spinner in case a request fails if (event instanceof NavigationCancel) { this.loading = false } if (event instanceof NavigationError) { this.loading = false } }

A continuación se muestra uno de los códigos que cómo recargo mi página:

 this.router.navigate(['/order']) .then(() => { window.location.reload(); });
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

si este código está en su app.component.ts, agregue esto

 initializeApp() { this.platform.ready().then(() => { this.splashScreen.hide(); })

y en tu config.xml

 <preference name="SplashScreenDelay" value="3000" />

tenga en cuenta que el valor podría cambiar según su aplicación

o si el código estaba en la página, puede agregar el código a su constructor,

o puede cambiar el valor de la función setTimeout a un número mayor (como 500, 1000 ... etc.)

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda