Подтверждение пароля формы Ionic 3

Я создаю регистрационную форму в Ionic 3, у меня есть два поля - пароль1 и пароль2, и требование - пароль2 должен быть таким же, как пароль1.

Мой компонент:

public registration : FormGroup;

    constructor(private formBuilder: FormBuilder) {

        this.registration = this.formBuilder.group({
            username: ['', Validators.compose([Validators.pattern('^(?=.*[a-zA-Z])(?=.*[0-9])[a-zA-Z0-9]+$'), Validators.required])],
            email: ['', Validators.compose([Validators.email, Validators.required])],
            password1: ['', Validators.compose([Validators.minLength(5), Validators.pattern('^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])[a-zA-Z0-9]+$'), Validators.required])],
            password2: ['', Validators.required],
        }, (registration: FormGroup) => {
            return PasswordValidator.areEqual(registration);
        });
    }

    validation_messages = {
        'username': [
        { type: 'pattern', message: 'Username must contain only combination of letterns and numbers.' },
        { type: 'required', message: 'Username is required.' }
        ],
        'email': [
        { type: 'required', message: 'Email is required.' },
        { type: 'email', message: 'Not a valid email!' }
        ],
        'password1': [
        { type: 'minlength', message: 'Password must be minimum 5 characters.' },
        { type: 'required', message: 'Password is required.' },
        { type: 'pattern', message: 'Password must contain combination of upper and lower case letterns and numbers.' }
        ],
        'password2': [
        { type: 'required', message: 'Password is required.' },
        { type: 'areEqual', message: 'Confirm password is not same.' },
        ],

    }

Я создал валидатор пароля в отдельном файле (не уверен, что это правильный способ):

import { FormControl, FormGroup } from '@angular/forms';

export class PasswordValidator {
static areEqual(formGroup: FormGroup) {
    let val;
    let valid = true;

    for (let key in formGroup.controls) {
        if (formGroup.controls.hasOwnProperty(key)) {
            let control: FormControl = <FormControl>formGroup.controls[key];
            if (val === undefined) {
                val = control.value
            } else {
                if (val !== control.value) {
                    valid = false;
                    break;
                }
            }
        }
    }
    if (valid) {
        return null;
    }
    return {
        areEqual: true
    }
 }
}

И мой шаблон:

<!-- Registration Form -->
<form *ngSwitchCase = "'registrationForm'" [formGroup] = "registration" (ngSubmit) = "register()" autocomplete = "off">

    <ion-item>
        <ion-label>Username</ion-label>
        <ion-input type = "text" formControlName = "username"></ion-input>
    </ion-item>
    <!-- Username validation errors -->
    <div class = "validation-errors">
        <ng-container *ngFor = "let validation of validation_messages.username" >
            <div class = "error-message" *ngIf = " registration.get('username').hasError(validation.type) 
            && ( registration.get('username').dirty || registration.get('username').touched)">
                {{ validation.message }}
            </div>
        </ng-container>
    </div>


    <ion-item>
        <ion-label>Email</ion-label>
        <ion-input type = "email" formControlName = "email"></ion-input>
    </ion-item>
    <!-- Email validation errors -->
    <div class = "validation-errors">
        <ng-container *ngFor = "let validation of validation_messages.email" >
            <div class = "error-message" *ngIf = " registration.get('email').hasError(validation.type) 
            && ( registration.get('email').dirty || registration.get('email').touched)">
                {{ validation.message }}
            </div>
        </ng-container>
    </div>


    <ion-item>
        <ion-label>Password1</ion-label>
        <ion-input type = "password" formControlName = "password1"></ion-input>
    </ion-item>
    <!-- Password1 validation errors -->
    <div class = "validation-errors">
        <ng-container *ngFor = "let validation of validation_messages.password1" >
            <div class = "error-message" *ngIf = " registration.get('password1').hasError(validation.type) 
            && ( registration.get('password1').dirty || registration.get('password1').touched)">
                {{ validation.message }}
            </div>
        </ng-container>
    </div>

    <ion-item>
        <ion-label>Password2</ion-label>
        <ion-input type = "password" formControlName = "password2"></ion-input>
    </ion-item>
    <!-- Password2 validation errors -->
    <div class = "validation-errors">
        <ng-container *ngFor = "let validation of validation_messages.password2" >
            <div class = "error-message" *ngIf = " registration.get('password2').hasError(validation.type) 
            && ( registration.get('password2').dirty || registration.get('password2').touched)">
                {{ validation.message }}
            </div>
        </ng-container>
    </div>

    <button ion-button full type = "submit" [disabled] = "!registration.valid">Submit</button>
</form>

Все остальные проверки работают правильно, т.е. печатаются правильные сообщения. Проверка пароля 2 работает только для пустого пароля и не работает для проверки того, совпадает ли он с паролем 1.

Что я делаю неправильно?