diff --git a/projects/xtream/ngx-validation-errors/src/lib/form-field-empty-container.directive.ts b/projects/xtream/ngx-validation-errors/src/lib/form-field-empty-container.directive.ts
index 29fbad6..3ed5998 100644
--- a/projects/xtream/ngx-validation-errors/src/lib/form-field-empty-container.directive.ts
+++ b/projects/xtream/ngx-validation-errors/src/lib/form-field-empty-container.directive.ts
@@ -5,7 +5,7 @@ import {toScreamingSnakeCase} from './utils';
 import {MESSAGES_PROVIDER} from './injection-tokens';
 
 export class ForFieldErrorsContext {
-  constructor(public errors: string[]) {
+  constructor(public errors: string[], public params: {} = {}) {
   }
 }
 
@@ -31,7 +31,7 @@ export class FormFieldEmptyContainerDirective implements DoCheck {
 
   public messages: string[];
   private validationContext;
-  private context = {errors: [] as string[]};
+  private context = {errors: [] as string[], params: {}};
 
   constructor(
     private renderer: Renderer2,
@@ -72,6 +72,7 @@ export class FormFieldEmptyContainerDirective implements DoCheck {
     if ((messages && !this.messages) || (!messages && this.messages) || (messages && messages[0] !== this.messages[0])) {
       this.messages = messages;
       this.context.errors = messages;
+      this.context.params = this.messageParams;
       if (this.rootEl) {
         if (messages) {
           this.renderer.addClass(this.rootEl, 'has-error');
diff --git a/src/app/material-from/material-from.component.html b/src/app/material-from/material-from.component.html
index 64ab055..f5d2238 100644
--- a/src/app/material-from/material-from.component.html
+++ b/src/app/material-from/material-from.component.html
@@ -6,16 +6,16 @@ <h2 style="text-align: center">xtream validation errors</h2>
 
 
   <div style="display:flex;flex-direction: column;">
-    <mat-form-field *ngxValidationErrors="heroForm.get('name'); errors as errors">
+    <mat-form-field *ngxValidationErrors="heroForm.get('name'); errors as errors; params as params">
       <input matInput formControlName="name" placeholder="name"/>
-      <mat-error *ngIf="errors">{{errors}}</mat-error>
+      <mat-error *ngIf="errors">{{errors[0] | translate: params}}</mat-error>
     </mat-form-field>
   </div>
 
   <div style="display:flex;flex-direction: column;">
-    <mat-form-field *ngxValidationErrors="heroForm.get('surname'); errors as errors">
+    <mat-form-field *ngxValidationErrors="heroForm.get('surname'); errors as errors; params as params">
       <input matInput formControlName="surname" placeholder="surname"/>
-      <mat-error *ngIf="errors">{{errors}}</mat-error>
+      <mat-error *ngIf="errors">{{errors[0] | translate: params}}</mat-error>
     </mat-form-field>
   </div>
 
@@ -26,16 +26,16 @@ <h2 style="text-align: center">xtream validation errors</h2>
 
 <form [formGroup]="heroForm" validationContext="USER.REGISTRATION">
   <div style="display:flex;flex-direction: column;">
-    <mat-form-field  *ngxValidationErrors="heroForm.get('name');errors as errors">
+    <mat-form-field  *ngxValidationErrors="heroForm.get('name'); errors as errors; params as params">
       <input matInput formControlName="name" placeholder="name"/>
-      <mat-error *ngIf="errors">{{errors}}</mat-error>
+      <mat-error *ngIf="errors">{{errors[0] | translate: params}}</mat-error>
     </mat-form-field>
   </div>
 
   <div style="display:flex;flex-direction: column;">
-    <mat-form-field  *ngxValidationErrors="heroForm.get('surname');errors as errors">
+    <mat-form-field  *ngxValidationErrors="heroForm.get('surname'); errors as errors; params as params">
       <input matInput formControlName="surname" placeholder="surname"/>
-      <mat-error *ngIf="errors">{{errors}}</mat-error>
+      <mat-error *ngIf="errors">{{errors[0] | translate: params}}</mat-error>
     </mat-form-field>
   </div>