Demos / Examples

• Install the package : npm install ang-slider-toggle --save

Import AngSlideToggleModule into NgModule in app.module.ts. CommonModule is also required.

import { AngSlideToggleModule } from 'ang-slider-toggle';
import { CommonModule } from '@angular/common';

@NgModule({
  // ...
  imports: [
    AngSlideToggleModule,
    CommonModule
  ]
  // ...
})

Add the following component tag in you template

<ang-slider-toggle [sliderSettings]='settings' [checked]="true" [disabled]="false"></ang-slider-toggle>

settings

 settings = {
    barCheckedBgColor: '#beebe9',
    sliderCheckedColor: '#3fc5f0',
    barUncheckedBgColor: '#ded5d5',
    sliderUncheckedColor: '#bdbdbd'
  }

or

<ang-slider-toggle 
barCheckedBgColor="#beebe9" 
sliderCheckedColor="#3fc5f0"
barUncheckedBgColor="#ded5d5",
sliderUncheckedColor="#bdbdbd"
[checked]="true" 
[disabled]="false">
</ang-slider-toggle>

click animation on slider

• Clone the repository or downlod the .zip,.tar files.
• Run npm install
• Run ng serve for a dev server
• Navigate to http://localhost:4200/

free to use on any purpose.