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

292
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(); });
over 4 years ago · Santiago Trujillo
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.)

over 4 years ago · Santiago Trujillo 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