How to add validation to TD-form?

Question

JavaScript

I made a template driven form. But I do not understand how you can add field validation. In doing so, I wrote the validation rules into the object.
Please help me to implement them, at least for one field (I will finish the rest myself by analogy). Displaying error messages is not necessary, the main thing is that the fields are validated.
Live example here .
Here is the template code:

<form class="form" (ngSubmit)="onSubmit()">
      <div class="line">
        <label for="">Новый пароль</label>
        <input type="password" ngModel [(ngModel)]="form.newPass" name="newPass" (ngModelChange)="validateField('newPass')">     
      </div>
        
      <div class="line">
        <label for="">Новый логин</label>
        <input type="text" ngModel [(ngModel)]="form.newLogin" name="newLogin" (ngModelChange)="validateField('newLogin')">
      </div>
  
      <div class="line">
        <label for="">Согласие на использование персональных данных</label>
        <input type="checkbox" value="true" ngModel [(ngModel)]="form.personalData" name="personalData" (ngModelChange)="validateField('personalData')">
      </div>
  
      <div class="line">
        <button [disabled]="isDisabledSubmitBtn()" type="submit">Отправить</button>
      </div>
    </form>

Here is the component code:

form: Object = {
    newPass: null,
    newLogin: null,
    personalData: null
  };

  errors: Object = {
    newPass: [],
    newLogin: [],
    personalData: []
  };

  constructor() { }

  ngOnInit() {
  }

  onSubmit(): void {
    alert('form is submit');
  }

  validateField(field): void {
    console.log(field);
  }

  isDisabledSubmitBtn(): boolean {
    let isDisabled = true;

    if(
      !this.errors.newPass.length && this.form.newPass &&
      !this.errors.newLogin.length && this.form.newLogin &&
      !this.errors.personalData.length && this.form.personalData
    ) 
    {
      isDisabled = false;
    }

    return isDisabled;
  }

    validators: any = {
        newPassword: [
            {
                message: 'Новый пароль должен содержать не менее 8 и не более 99 символов',
                validator: (control) => {
                    return Validators.minLength(8)(control) || Validators.maxLength(99)(control);
                }
            },
            {
                message: `Введен недопустимый символ. Допустимые символы: a-zA-Z0-9а-яА-Я[email protected]#%&*;':",./?`,
                validator: (control) => {
                    if (control && control.value) {
                        return /[^A-ZА-Яa-zа-я\[email protected]#%&*;‘:“,./?.]/.test(control.value) ? true : null;
                    }
                    return null;
                }
            }
        ],
        newLogin: [
            {
                message: 'Новый логин должен содержать не менее 6 и не более 15 символов',
                validator: (control) => {
                    return Validators.minLength(6)(control) || Validators.maxLength(15)(control);
                }
            },
            {
                message: `Введен недопустимый символ. Допустимые символы: a-z`,
                validator: (control) => {
                    if (control && control.value) {
                        return /[^a-z]/.test(control.value) ? true : null;
                    }
                    return null;
                }
            }
        ]
    };