Solucionar mensagem de erro em Typescript

Eu tenho o seguinte código em typescript, que está limitando um input number a ter apenas 4 caracteres, mas eu preciso que esse mesmo código obrigue o usuário a digitar os 4 caracteres. Não pode ser 1, 2 ou 3, porque é um innput que receberá o ano (2024, 2025 e assim por diante).

limitInputLength(event: Event): void {
    const input = event.target as HTMLInputElement;
    let value = input.value.replace(/[^0-9]/g, '');
    input.value = input.value.slice(0, 4); //* remove não numéricos e limita a 4 dígitos
    this.inputValue = input.value ? parseInt(value, 10) : null; //* atualiza o modelo
  };


  validateInput(): void {
    if (this.inputValue !== null && this.inputValue.toString().length === 4) {
      this.errorMessage = ''; // esconde a mensagem de erro
    } else {
      this.errorMessage = 'O número deve ter exatamente 4 dígitos.';
    }
  }
}

<div class="input-group w-auto">
    <span class="input-group-text">ANO</span>
    <input
      type="number"
      class="form-control"
      min="2000"
      max="2099"
      step="1"
      (input)="limitInputLength($event)"
      (blur)="limitInputLength($event)"
    />
    <button (onClick)="validateInput()" class="btn btn-primary">Validar</button>
    <p *ngIf="errorMessage" class="text-danger">{{ errorMessage }}</p>
  </div>

Mesmo que minha alteração faça ser preciso deixar o input com bordas vermelhas ao se deparar com esse "erro" de digitar menos caracteres que 4, e também possa aparecer um alerta abaixo do input exigindo que o usuário digite corretamente. Como eu poderia fazer isso? Visto que da forma que eu fiz está somente limitando os 4 caracteres mas não aparece nenhuma mensagem de erro, mesmo digitando 1, 2 ou 3 caracteres e apertando enter, clicando fora do input. Já tentei usar (blur) e não deu certo também.

Estou utilizando Angular 19 e Bootstrap 5.