bugfix error messages on form groups (closes #475)

udos86 · Aug 31, 2017 · e51473c · e51473c
1 parent 4d21361
commit e51473c
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 19 deletions.
diff --git a/example/app/bootstrap/bootstrap-example.model.ts b/example/app/bootstrap/bootstrap-example.model.ts
@@ -9,13 +9,20 @@ import {
     DynamicFormGroupModel
 } from "@ng2-dynamic-forms/core";
 import { Observable } from "rxjs/Observable";
+import { Validators } from "@angular/forms";
 
 export const BOOTSTRAP_EXAMPLE_MODEL = [
 
     new DynamicFormGroupModel({
 
         id: "bootstrapFormGroup1",
         legend: "Form Group 1",
+        validator: {
+            required: null
+        },
+        errorMessages: {
+            required: "error on {{ id }}"
+        },
         group: [
             new DynamicSelectModel<string>(
                 {

diff --git a/modules/core/src/service/dynamic-form-validation.service.ts b/modules/core/src/service/dynamic-form-validation.service.ts
@@ -1,11 +1,13 @@
 import { Injectable, Inject, Optional } from "@angular/core";
 import {
     AbstractControl,
-    ValidatorFn,
     AsyncValidatorFn,
+    FormControl,
+    FormGroup,
+    ValidatorFn,
     Validators,
     NG_VALIDATORS,
-    NG_ASYNC_VALIDATORS
+    NG_ASYNC_VALIDATORS, FormArray
 } from "@angular/forms";
 import {
     DynamicFormControlModel,
@@ -83,6 +85,22 @@ export class DynamicFormValidationService {
         return validatorFns;
     }
 
+    private parseErrorMessageTemplate(template: string, model: DynamicFormControlModel, error: any = null): string {
+
+        return template.replace(/{{\s*(.+?)\s*}}/mg, (match: string, expression: string) => {
+
+            let propertySource: any = model,
+                propertyName: string = expression;
+
+            if (expression.indexOf("validator.") >= 0 && error) {
+
+                propertySource = error;
+                propertyName = expression.replace("validator.", "");
+            }
+
+            return propertySource[propertyName] ? propertySource[propertyName] : null;
+        });
+    }
 
     getValidatorByName(validatorName: string, validatorArgs: any = null): ValidatorFn {
         return this.getValidatorFn(validatorName, validatorArgs) as ValidatorFn;
@@ -132,31 +150,36 @@ export class DynamicFormValidationService {
 
     createErrorMessages(control: AbstractControl, model: DynamicFormControlModel): string[] {
 
-        return Object.keys(control.errors || {}).map(errorCode => {
+        let messages: string[] = [];
 
-            let error = control.getError(errorCode),
-                message = `Validation error: ${errorCode}`,
-                messageKey = Utils.equals(errorCode, "minlength", "maxlength") ? errorCode.replace("length", "Length") : errorCode;
+        if (control instanceof FormControl) {
 
-            if (model.errorMessages.hasOwnProperty(messageKey)) {
+            Object.keys(control.errors || {}).forEach(errorCode => {
+
+                let messageKey = Utils.equals(errorCode, "minlength", "maxlength") ?
+                    errorCode.replace("length", "Length") : errorCode;
+
+                if (model.errorMessages.hasOwnProperty(messageKey)) {
+
+                    let error = control.getError(errorCode),
+                        template = model.errorMessages[messageKey] as string;
+
+                    messages.push(this.parseErrorMessageTemplate(template, model, error));
+                }
+            });
 
-                message = (model.errorMessages[messageKey] as string).replace(/{{\s*(.+?)\s*}}/mg,
-                    (match: string, expression: string) => {
+        } else if (control instanceof FormGroup || control instanceof FormArray) {
 
-                        let propertySource: any = model,
-                            propertyName: string = expression;
+            let messageKey = Object.keys(model.errorMessages)[0] as string;
 
-                        if (expression.indexOf("validator.") >= 0) {
+            if (model.errorMessages.hasOwnProperty(messageKey)) {
 
-                            propertySource = error;
-                            propertyName = expression.replace("validator.", "");
-                        }
+                let template = model.errorMessages[messageKey] as string;
 
-                        return propertySource[propertyName] ? propertySource[propertyName] : null;
-                    });
+                messages.push(this.parseErrorMessageTemplate(template, model));
             }
+        }
 
-            return message;
-        });
+        return messages;
     }
 }