Why is my text not updating on my HTML even though it changes on my .ts? How do I fix this?

I am trying to create a terminal Pop-up which types out a message then redirects. The terminal does pop-up and the cursor is visible but the message does not get typed out. I have debugged it a few times and I am seeing that the message is getting populated letter by letter. I did try to change my approach to use an AsyncPipe but that didnt work either.

Here is my login.ts file

import { Component, ChangeDetectorRef } from '@angular/core'; import { Router } from '@angular/router'; import { CommonModule } from '@angular/common'; import { Navigation } from '../../shared/navbar/navigation'; @Component({ selector: 'app-login', standalone: true, imports: [Navigation, CommonModule], templateUrl: './login.html', styleUrl: './login.scss', }) export class Login { isLoggingIn = false; showTerminal = false; terminalText = ''; fullMessage = "> AUTHENTICATION CONFIRMED.\n> DECRYPTING USER PROFILE...\n> ACCESS GRANTED.\n> INITIALIZING IDE..."; constructor(private router: Router, private cdr: ChangeDetectorRef) { } startLogin() { if (!this.isLoggingIn) { this.isLoggingIn = true; } } onAnimationFinish(event: AnimationEvent) { this.showTerminal = true; this.startTyping(); } startTyping() { let index = 0; this.terminalText = ''; const typingInterval = setInterval(() => { this.terminalText += this.fullMessage[index]; index++; console.log("Typing:", this.terminalText); this.cdr.detectChanges(); if (index === this.fullMessage.length) { clearInterval(typingInterval); setTimeout(() => { this.router.navigate(['home']); }, 1000); } }, 40); } }

Here is the HTML to display the text:

@if (showTerminal) { <div class="fixed inset-0 bg-black z-[9999] flex items-center justify-center p-10 font-mono select-none"> <div class="max-w-3xl w-full"> <div class="text-green-500 text-xl md:text-3xl leading-relaxed whitespace-pre-wrap shadow-green-500 drop-shadow-md font-bold"> {{ terminalText }}<span class="animate-pulse">_</span> </div> </div> </div> }

Could anyone kindly assist me with what I am doing wrong?

Thank you