I created an intro/splash screen component that should display for 5 seconds and then automatically navigate to the login page.

The strange thing is:

• If I don’t use setTimeout, Angular correctly renders the content of the component’s HTML template.

• As soon as I wrap the navigation in a setTimeout (or any asynchronous operation), the page stays completely blank — nothing from the template is displayed.

Ts file

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-introduction-page',
  imports: [],
  templateUrl: './introduction-page.html',
})
export class IntroductionPage implements OnInit{
  private intervalId: any;

  constructor(private router: Router) {
  }

  ngOnInit(): void {
    setTimeout(() => {
      this.router.navigate(['/login'])
      
    }, 5000);}
}

Html file

Hello

Thank you,

Giorgio