From e754e40118dbd1f9f48e9317990d27322573cb85 Mon Sep 17 00:00:00 2001
From: jojohoch <joachim.hoch@iqb.hu-berlin.de>
Date: Tue, 20 Jul 2021 12:20:33 +0200
Subject: [PATCH] Add `mat-form-field` wrapper to `TextFieldComponent`
---
projects/common/app.module.ts | 4 ++-
.../text-field.component.ts | 34 ++++++++++---------
2 files changed, 21 insertions(+), 17 deletions(-)
diff --git a/projects/common/app.module.ts b/projects/common/app.module.ts
index 40932a2f2..f7121802c 100644
--- a/projects/common/app.module.ts
+++ b/projects/common/app.module.ts
@@ -39,7 +39,9 @@ import { DropdownComponent } from './element-components/dropdown.component';
MatRadioModule,
MatCheckboxModule,
ReactiveFormsModule,
- FormsModule
+ FormsModule,
+ MatFormFieldModule,
+ MatInputModule
],
declarations: [
ButtonComponent,
diff --git a/projects/common/element-components/text-field.component.ts b/projects/common/element-components/text-field.component.ts
index d83f27c03..1ea51cd9d 100644
--- a/projects/common/element-components/text-field.component.ts
+++ b/projects/common/element-components/text-field.component.ts
@@ -5,22 +5,24 @@ import { FormElementComponent } from '../form-element-component.directive';
@Component({
selector: 'app-text-field',
template: `
- <input *ngIf="elementModel.multiline === false" matInput
- placeholder="{{elementModel.placeholder}}"
- [formControl]="formElementControl">
- <textarea *ngIf="elementModel.multiline === true" matInput
- placeholder="{{elementModel.placeholder}}"
- [formControl]="formElementControl"
- [style.width.px]="elementModel.width"
- [style.height.px]="elementModel.height"
- [style.background-color]="elementModel.backgroundColor"
- [style.color]="elementModel.fontColor"
- [style.font-family]="elementModel.font"
- [style.font-size.px]="elementModel.fontSize"
- [style.font-weight]="elementModel.bold ? 'bold' : ''"
- [style.font-style]="elementModel.italic ? 'italic' : ''"
- [style.text-decoration]="elementModel.underline ? 'underline' : ''">
- </textarea>
+ <mat-form-field>
+ <input *ngIf="elementModel.multiline === false" matInput
+ placeholder="{{elementModel.placeholder}}"
+ [formControl]="formElementControl">
+ <textarea *ngIf="elementModel.multiline === true" matInput
+ placeholder="{{elementModel.placeholder}}"
+ [formControl]="formElementControl"
+ [style.width.px]="elementModel.width"
+ [style.height.px]="elementModel.height"
+ [style.background-color]="elementModel.backgroundColor"
+ [style.color]="elementModel.fontColor"
+ [style.font-family]="elementModel.font"
+ [style.font-size.px]="elementModel.fontSize"
+ [style.font-weight]="elementModel.bold ? 'bold' : ''"
+ [style.font-style]="elementModel.italic ? 'italic' : ''"
+ [style.text-decoration]="elementModel.underline ? 'underline' : ''">
+ </textarea>
+ </mat-form-field>
`
})
export class TextFieldComponent extends FormElementComponent {
--
GitLab