[player] Fix saving of inputs via the virtual keyboard

projects/player/src/app/components/element-container/element-container.component.ts

@@ -12,9 +12,7 @@ import { FormService } from '../../services/form.service';
 import { UnitStateService } from '../../services/unit-state.service';
 import { MarkingService } from '../../services/marking.service';
 import {
-  InputElement, InputElementValue,
-  UIElement,
-  ValueChangeElement
+  InputElement, InputElementValue, UIElement, ValueChangeElement
 } from '../../../../../common/models/uI-element';
 import { FormElementComponent } from '../../../../../common/form-element-component.directive';
 import { CompoundElementComponent }
@@ -204,7 +202,7 @@ export class ElementContainerComponent implements OnInit {
               focussedInputControl as HTMLTextAreaElement :
               focussedInputControl as HTMLInputElement;
             this.keyboardLayout = (this.elementModel as TextFieldElement).inputAssistancePreset;
-            this.isKeyboardOpen = this.keyboardService.openKeyboard(inputElement);
+            this.isKeyboardOpen = this.keyboardService.openKeyboard(inputElement, elementComponent);
           } else {
             this.isKeyboardOpen = this.keyboardService.closeKeyboard();
           }

projects/player/src/app/services/keyboard.service.ts

 import { Injectable } from '@angular/core';
+import { FormElementComponent } from '../../../../common/form-element-component.directive';
 
 @Injectable({
   providedIn: 'root'
 })
 export class KeyboardService {
-  private inputControl!: HTMLTextAreaElement | HTMLInputElement;
+  private inputElement!: HTMLTextAreaElement | HTMLInputElement;
+  private elementComponent!: FormElementComponent;
 
   enterKey = (key: string): void => {
-    const selectionStart = this.inputControl.selectionStart || 0;
-    const selectionEnd = this.inputControl.selectionEnd || this.inputControl.value.length;
-    const startText = this.inputControl.value.substring(0, selectionStart);
-    const endText = this.inputControl.value.substring(selectionEnd);
-    this.inputControl.value = startText + key + endText;
+    const selectionStart = this.inputElement.selectionStart || 0;
+    const selectionEnd = this.inputElement.selectionEnd || this.inputElement.value.length;
+    const startText = this.inputElement.value.substring(0, selectionStart);
+    const endText = this.inputElement.value.substring(selectionEnd);
+    this.elementComponent.elementFormControl.setValue(startText + key + endText);
     const selection = selectionStart ? selectionStart + 1 : 1;
-    this.inputControl.setSelectionRange(selection, selection);
+    this.inputElement.setSelectionRange(selection, selection);
   };
 
-  openKeyboard(inputControl: HTMLTextAreaElement | HTMLInputElement): boolean {
-    this.inputControl = inputControl;
+  openKeyboard(inputElement: HTMLTextAreaElement | HTMLInputElement,
+               elementComponent: FormElementComponent): boolean {
+    this.inputElement = inputElement;
+    this.elementComponent = elementComponent;
     return true;
   }