All files / components/text-input text-input.component.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
1x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
<mat-form-field [appearance]="matAppearance()">
    @if (label()) {
        <mat-label>{{ label() }}</mat-label>
    }
 
    @if (icon(); as iconName) {
        <mat-icon matPrefix>{{ iconName }}</mat-icon>
    }
 
    @if (multiline()) {
        <textarea
            matInput
            [value]="displayValue()"
            [rows]="rows()"
            [placeholder]="placeholder()"
            [disabled]="disabled() || isDisabled()"
            [readonly]="readonly()"
            [required]="required()"
            [attr.maxlength]="maxLength()"
            [attr.minlength]="minLength()"
            (input)="onInput($event)"
            (blur)="onBlur()"
        ></textarea>
    } @else {
        <input
            matInput
            [type]="type()"
            [value]="displayValue()"
            [placeholder]="placeholder()"
            [autocomplete]="autocomplete()"
            [disabled]="disabled() || isDisabled()"
            [readonly]="readonly()"
            [required]="required()"
            [attr.maxlength]="maxLength()"
            [attr.minlength]="minLength()"
            (input)="onInput($event)"
            (blur)="onBlur()"
        />
    }
 
    @if (hint() && !errorMessage()) {
        <mat-hint>{{ hint() }}</mat-hint>
    }
 
    @if (errorMessage()) {
        <mat-error>{{ errorMessage() }}</mat-error>
    }
</mat-form-field>