fix: Display change password validation message

src/app/shared/change-password-dialog/change-password-dialog.component.html

@@ -8,23 +8,19 @@
         formControlName="password"
         label="{{ 'Password' | translateKey: 'inputs' }}"
       ></mifosx-input-password>
-      <div class="error">
-        <p *ngIf="changePasswordForm.get('password').errors?.['uppercase']">
-          {{ changePasswordForm.get('password').errors?.['uppercase'] | translateKey: 'inputs' }}
+      <mat-error>
+        <p
+          *ngIf="
+            changePasswordForm.get('password').errors?.['uppercase'] ||
+            changePasswordForm.get('password').errors?.['number'] ||
+            changePasswordForm.get('password').errors?.['repeated'] ||
+            changePasswordForm.get('password').errors?.['specialChar'] ||
+            changePasswordForm.get('password').errors?.['minlength']
+          "
+        >
+          {{ 'labels.commons.Password validation' | translate: { minchar: minPasswordLength } }}
         </p>
-        <p *ngIf="changePasswordForm.get('password').errors?.['number']">
-          {{ changePasswordForm.get('password').errors?.['number'] | translateKey: 'inputs' }}
-        </p>
-        <p *ngIf="changePasswordForm.get('password').errors?.['repeated']">
-          {{ changePasswordForm.get('password').errors?.['repeated'] | translateKey: 'inputs' }}
-        </p>
-        <p *ngIf="changePasswordForm.get('password').errors?.['specialChar']">
-          {{ changePasswordForm.get('password').errors?.['specialChar'] | translateKey: 'inputs' }}
-        </p>
-        <p *ngIf="changePasswordForm.get('password').errors?.['minlength']">
-          {{ 'Password minimun length must be' | translateKey: 'inputs' }} {{ minPasswordLength }}
-        </p>
-      </div>
+      </mat-error>
 
       <mifosx-input-password
         #repeatPassword

src/app/shared/change-password-dialog/change-password-dialog.component.ts

@@ -42,18 +42,21 @@ export class ChangePasswordDialogComponent implements OnInit {
 
   /** Change Password form */
   createChangePasswordForm() {
-    this.changePasswordForm = this.formBuilder.group({
-      password: [
-        '',
-        this.passwordsUtility.getPasswordValidators()
-      ],
-      repeatPassword: [
-        '',
-        [
-          Validators.required,
-          this.confirmPassword('password')]
-      ]
-    });
+    this.changePasswordForm = this.formBuilder.group(
+      {
+        password: [
+          '',
+          this.passwordsUtility.getPasswordValidators()
+        ],
+        repeatPassword: [
+          '',
+          [
+            Validators.required,
+            this.confirmPassword('password')]
+        ]
+      },
+      { updateOn: 'blur' }
+    );
   }
 
   /**