signup.component.html :

<div class="form-row">
        <input type="password" formControlName="confirmPassword" class="input-text" placeholder="Confirm Password" required
          (focus)="onFocus('confirmPassword')" (blur)="onBlur('confirmPassword')">
        <div *ngIf="signupForm.controls.confirmPassword.touched && signupForm.hasError('passwordMismatch') && !isFieldFocused('confirmPassword')" class="alert alert-danger" role="alert">
          Passwords do not match
        </div>
      </div>

signup.component.ts :

     focusedField: string | null = null;
        
        ngOnInit(): void {
      this.signupForm = this.formBuilder.group({
          confirmPassword: ['', Validators.required]
      });
  }
        
        onFocus(fieldName: string): void {
          this.focusedField = fieldName;
          this.ok=true;
        }
        
        onBlur(fieldName: string): void {
          if (this.focusedField === fieldName) {
            this.focusedField = null;
            this.ok = false;
          }
        }
    
    isFieldFocused(fieldName: string): boolean {
      return this.focusedField === fieldName;
    }
    
    passwordMatchValidator(formGroup: FormGroup) {
      const password = formGroup.get('password')!.value;
      const confirmPassword = formGroup.get('confirmPassword')!.value;
      if (password !== confirmPassword) {
          formGroup.get('confirmPassword')!.setErrors({ passwordMismatch: true });
      } else {
          formGroup.get('confirmPassword')!.setErrors(null);
      }
    }

In all scenarios, the anticipated password verification alert is nowhere to be found. This applies whether the passwords match or not, leaving users in the dark about the success of their login attempt.