diff --git a/alfa-client/libs/design-component/src/lib/form/checkbox-editor/checkbox-editor.component.spec.ts b/alfa-client/libs/design-component/src/lib/form/checkbox-editor/checkbox-editor.component.spec.ts
index e5dd90b745edd9549abd452e66b8b566ce118e01..cada7efb7a5dc25e643c2854438cd39f626f70a9 100644
--- a/alfa-client/libs/design-component/src/lib/form/checkbox-editor/checkbox-editor.component.spec.ts
+++ b/alfa-client/libs/design-component/src/lib/form/checkbox-editor/checkbox-editor.component.spec.ts
@@ -56,7 +56,7 @@ describe('CheckboxEditorComponent', () => {
     describe('hasError', () => {
       it('should return true', () => {
         component.fieldControl.setErrors({ 1: createInvalidParam() });
-
+        component._updateInvalidParams();
         const result: boolean = component.hasError;
 
         expect(result).toBe(true);
@@ -76,6 +76,7 @@ describe('CheckboxEditorComponent', () => {
     describe('error message', () => {
       it('should show', () => {
         component.fieldControl.setErrors({ 1: createInvalidParam() });
+        component._updateInvalidParams();
         fixture.detectChanges();
 
         const element: HTMLElement = getElementFromFixture(fixture, errorMessageId);
diff --git a/alfa-client/libs/design-component/src/lib/form/formcontrol-editor.abstract.component.ts b/alfa-client/libs/design-component/src/lib/form/formcontrol-editor.abstract.component.ts
index 1227c464e93ac1d30efb35880ef6dc872bf280e3..0e77b51c101f31ac094b7c59f6fbae9834f76b9a 100644
--- a/alfa-client/libs/design-component/src/lib/form/formcontrol-editor.abstract.component.ts
+++ b/alfa-client/libs/design-component/src/lib/form/formcontrol-editor.abstract.component.ts
@@ -33,6 +33,7 @@ export abstract class FormControlEditorAbstractComponent implements ControlValue
   readonly fieldControl: UntypedFormControl = new UntypedFormControl();
   public onChange = (text: string | Date) => undefined;
   public onTouched = () => undefined;
+  public invalidParams: InvalidParam[] = [];
 
   private changesSubscr: Subscription;
   private statusSubscr: Subscription;
@@ -81,12 +82,16 @@ export abstract class FormControlEditorAbstractComponent implements ControlValue
   setErrors(): void {
     if (this.control) {
       this.fieldControl.setErrors(this.control.errors);
-      if (this.control.invalid) this.fieldControl.markAsTouched();
+      if (this.control.invalid) {
+        this._updateInvalidParams();
+        this.fieldControl.markAsTouched();
+      }
     }
   }
 
-  get invalidParams(): InvalidParam[] {
-    return this.fieldControl.errors ?
+  _updateInvalidParams(): void {
+    this.invalidParams =
+      this.fieldControl.errors ?
         Object.keys(this.fieldControl.errors).map((key) => <InvalidParam>this.fieldControl.errors[key])
       : [];
   }
diff --git a/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.html b/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.html
index 673ecf065e1b890e163cf98fab0335c180bea627..edc6820dfa4a6626a4e634f1116bff672bfc8fb6 100644
--- a/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.html
+++ b/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.html
@@ -23,6 +23,6 @@ Die sprachspezifischen Genehmigungen und Beschränkungen
 unter der Lizenz sind dem Lizenztext zu entnehmen.
 
 -->
-@for (invalidParam of invalidParams; track invalidParam) {
-  <span>{{ message(invalidParam) }}</span>
+@for (validationMessage of validationMessages; track validationMessage) {
+  <span>{{ validationMessage }}</span>
 }
diff --git a/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.ts b/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.ts
index eae4c1e99487d7fe169a73fee93d07af75f55676..3b2b26490f43530dfa97995a52cc1efed224f637 100644
--- a/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.ts
+++ b/alfa-client/libs/ui/src/lib/ui/validation-error/validation-error.component.ts
@@ -21,7 +21,7 @@
  * Die sprachspezifischen Genehmigungen und Beschränkungen
  * unter der Lizenz sind dem Lizenztext zu entnehmen.
  */
-import { InvalidParam, getMessageForInvalidParam } from '@alfa-client/tech-shared';
+import { getMessageForInvalidParam, InvalidParam } from '@alfa-client/tech-shared';
 import { Component, Input } from '@angular/core';
 
 @Component({
@@ -32,9 +32,10 @@ import { Component, Input } from '@angular/core';
 })
 export class ValidationErrorComponent {
   @Input() label: string;
-  @Input() invalidParams: InvalidParam[];
 
-  public message(invalidParam: InvalidParam): string {
-    return getMessageForInvalidParam(this.label, invalidParam);
+  @Input() set invalidParams(value: InvalidParam[]) {
+    this.validationMessages = value.map((invalidParam: InvalidParam) => getMessageForInvalidParam(this.label, invalidParam));
   }
+
+  public validationMessages: string[] = [];
 }