ng-toggle-button

Examples:

Default

Custom

ngModel: true

Disabled

In a formGroup

Active
Touched: false
Touched: true
Dirty: false
valid: true
invalid: false
pristine: true

Large

Another style


Custom values

ngModel: si

Two-way binding value

value: 1

Configure
Build your own


<ng-toggle
  [value]="1"
  [disabled]="false"
  [width]="50"
  [height]="25"
  [margin]="3"
  [fontSize]="10"
  [labels]="{
  "unchecked": "off",
  "checked": "on"
}"
  [color]="{
  "unchecked": "#BFCBD9",
  "checked": "#BFCBD9",
  "disabled": "#DBDBDB"
}"
  [switchColor]="{
  "checked": "#00a388",
  "unchecked": "red",
  "disabled": "#c0c0c0"
}"
  [values]="{
  "unchecked": 0,
  "checked": 1
}"
  [textAlign]="{
  "checked": "left",
  "unchecked": "right"
}"
  [fontColor]="{
  "checked": "#fafafa",
  "unchecked": "#f45a32",
  "disabled": "#ffffff"
}">
</ng-toggle>
1