/
slide-toggle.html
34 lines (33 loc) · 1.23 KB
/
slide-toggle.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
<div class="mdc-form-field"
[class.mdc-form-field--align-end]="labelPosition == 'before'">
<div class="mdc-switch" #switch>
<div class="mdc-switch__track"></div>
<div class="mdc-switch__thumb-underlay">
<div class="mat-mdc-slide-toggle-ripple mat-mdc-focus-indicator" mat-ripple
[matRippleTrigger]="switch"
[matRippleDisabled]="disableRipple || disabled"
[matRippleCentered]="true"
[matRippleAnimation]="_rippleAnimation"></div>
<div class="mdc-switch__thumb">
<input #input class="mdc-switch__native-control" type="checkbox"
role="switch"
[id]="inputId"
[required]="required"
[tabIndex]="tabIndex"
[checked]="checked"
[disabled]="disabled"
[attr.name]="name"
[attr.aria-checked]="checked.toString()"
[attr.aria-label]="ariaLabel"
[attr.aria-labelledby]="ariaLabelledby"
(change)="_onChangeEvent($event)"
(click)="_onInputClick($event)"
(blur)="_onBlur()"
(focus)="_focused = true">
</div>
</div>
</div>
<label [for]="inputId" (click)="$event.stopPropagation()">
<ng-content></ng-content>
</label>
</div>