UNPKG

2.41 kBHTMLView Raw
1<div class="md-input-wrapper">
2 <div class="md-input-table">
3 <div class="md-input-prefix"><ng-content select="[md-prefix]"></ng-content></div>
4
5 <div class="md-input-infix">
6 <input #input
7 aria-target
8 class="md-input-element"
9 [class.md-end]="align == 'end'"
10 [attr.aria-label]="ariaLabel"
11 [attr.aria-labelledby]="ariaLabelledBy"
12 [attr.aria-disabled]="ariaDisabled"
13 [attr.aria-required]="ariaRequired"
14 [attr.aria-invalid]="ariaInvalid"
15 [attr.autocomplete]="autocomplete"
16 [attr.autocorrect]="autocorrect"
17 [attr.autocapitalize]="autocapitalize"
18 [autofocus]="autofocus"
19 [disabled]="disabled"
20 [id]="inputId"
21 [attr.list]="list"
22 [attr.max]="max"
23 [attr.maxlength]="maxlength"
24 [attr.min]="min"
25 [attr.minlength]="minlength"
26 [readonly]="readonly"
27 [required]="required"
28 [spellcheck]="spellcheck"
29 [attr.step]="step"
30 [attr.tabindex]="tabindex"
31 [type]="type"
32 [attr.name]="name"
33 (focus)="_handleFocus($event)"
34 (blur)="_handleBlur($event)"
35 [(ngModel)]="value"
36 (change)="_handleChange($event)">
37
38 <label class="md-input-placeholder"
39 [attr.for]="inputId"
40 [class.md-empty]="empty"
41 [class.md-focused]="focused"
42 [class.md-float]="floatingPlaceholder"
43 [class.md-accent]="dividerColor == 'accent'"
44 [class.md-warn]="dividerColor == 'warn'"
45 *ngIf="_hasPlaceholder()">
46 <ng-content select="md-placeholder"></ng-content>
47 {{placeholder}}
48 <span class="md-placeholder-required" *ngIf="required">*</span>
49 </label>
50 </div>
51
52 <div class="md-input-suffix"><ng-content select="[md-suffix]"></ng-content></div>
53 </div>
54
55 <div class="md-input-underline"
56 [class.md-disabled]="disabled">
57 <span class="md-input-ripple"
58 [class.md-focused]="focused"
59 [class.md-accent]="dividerColor == 'accent'"
60 [class.md-warn]="dividerColor == 'warn'"></span>
61 </div>
62
63 <div *ngIf="hintLabel != ''" class="md-hint">{{hintLabel}}</div>
64 <ng-content select="md-hint"></ng-content>
65</div>