[editor] Fix number inputs

- Use ngModel so it returns number

projects/editor/src/app/dialog.service.ts

@@ -196,11 +196,12 @@ export class RichTextEditDialog {
               <input matInput type="text" [value]="newPlayerConfig.hintLabel || data.player.hintLabel"
                      (input)="newPlayerConfig.hintLabel = $any($event.target).value">
             </mat-form-field>
-            <mat-form-field *ngIf="newPlayerConfig.hintLabel !== ''" appearance="fill">
+            <mat-form-field *ngIf="newPlayerConfig.hintLabel || data.player.hintLabel"
+                            appearance="fill">
               <mat-label>{{ 'player.hintLabelDelay' | translate }}</mat-label>
-              <input matInput type="number" step="1000"
-                     [value]="newPlayerConfig.hintLabelDelay"
-                     (input)="newPlayerConfig.hintLabelDelay = $any($event.target).value">
+              <input matInput type="number" step="1000" min="0"
+                     [ngModel]="newPlayerConfig.hintLabelDelay || data.player.hintLabelDelay"
+                     (ngModelChange)="newPlayerConfig.hintLabelDelay = $event">
             </mat-form-field>
           </div>
         </mat-tab>
@@ -235,13 +236,15 @@ export class RichTextEditDialog {
             </mat-form-field>
             <mat-form-field appearance="fill">
               <mat-label>{{ 'player.minRuns' | translate }}</mat-label>
-              <input matInput type="number" [value]="newPlayerConfig.minRuns || data.player.minRuns"
-                     (input)="newPlayerConfig.minRuns = $any($event.target).value">
+              <input matInput type="number" min="0"
+                     [ngModel]="newPlayerConfig.minRuns || data.player.minRuns"
+                     (ngModelChange)="newPlayerConfig.minRuns = $event">
             </mat-form-field>
             <mat-form-field appearance="fill">
               <mat-label>{{ 'player.maxRuns' | translate }}</mat-label>
-              <input matInput type="number" [value]="newPlayerConfig.maxRuns || data.player.maxRuns"
-                     (input)="newPlayerConfig.maxRuns = $any($event.target).value">
+              <input matInput type="number" min="0"
+                     [ngModel]="newPlayerConfig.maxRuns || data.player.maxRuns"
+                     (ngModelChange)="newPlayerConfig.maxRuns = $event">
             </mat-form-field>
           </div>
         </mat-tab>

projects/editor/src/app/unit-view/page-view/properties-panel/element-style-properties.component.ts

@@ -34,14 +34,20 @@ import { UIElement } from '../../../../../../common/models/uI-element';
       <mat-form-field *ngIf="combinedProperties.fontSize != null"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>Schriftgröße</mat-label>
-        <input matInput type="number" [value]="combinedProperties.fontSize"
-               (input)="updateModel.emit({ property: 'fontSize', value: $any($event.target).value })">
+        <input matInput type="number" #fontSize="ngModel" min="0"
+               [ngModel]="combinedProperties.fontSize"
+               (ngModelChange)="updateModel.emit({ property: 'fontSize',
+                                                   value: $event,
+                                                   isInputValid: fontSize.valid && $event !== null})">
       </mat-form-field>
       <mat-form-field *ngIf="combinedProperties.lineHeight != null"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>Zeilenhöhe</mat-label>
-        <input matInput type="number" [value]="combinedProperties.lineHeight"
-               (input)="updateModel.emit({ property: 'lineHeight', value: $any($event.target).value })">
+        <input matInput type="number" #lineHeight="ngModel" min="0"
+               [ngModel]="combinedProperties.lineHeight"
+               (ngModelChange)="updateModel.emit({ property: 'lineHeight',
+                                                   value: $event,
+                                                   isInputValid: lineHeight.valid && $event !== null })">
       </mat-form-field>
 
       <mat-checkbox *ngIf="combinedProperties.bold != null"
@@ -64,5 +70,5 @@ import { UIElement } from '../../../../../../common/models/uI-element';
 })
 export class ElementStylePropertiesComponent {
   @Input() combinedProperties: UIElement = {} as UIElement;
-  @Output() updateModel = new EventEmitter<{ property: string; value: string | boolean }>();
+  @Output() updateModel = new EventEmitter<{ property: string; value: string | boolean, isInputValid?: boolean | null }>();
 }