NG-TOGGLE - Native Angular components & directives for Bootstrap-styled Toggle Switch
Angular Bootstrap-styled Toggle component that can be used as a standalone toggle or can convert checkboxes into UI toggles.
Demo
View it in action at https://nth-cloud.github.io/ng-toggle
Dependencies
- Angular (tested with 7.0.0)
- Bootstrap 4 (tested with 4.2.1)
ng-toggle | Angular | Bootstrap CSS |
---|---|---|
1.x.x | 5.2.1 | 4.0.0 |
2.x.x | 6.1.0 | 4.0.0 |
3.x.x | 7.0.0 | 4.0.0 |
Installation
After installing the above dependencies, install ng-toggle
via:
npm install --save @nth-cloud/ng-toggle
Import the main module into your project:
import {NgToggleModule} from '@nth-cloud/ng-toggle';
Import the module into your application:
import {NgToggleModule} from '@nth-cloud/ng-toggle'; @NgModule({ declarations: [AppComponent, ...], imports: [NgToggleModule, ...], bootstrap: [AppComponent] }) export class AppModule { }
If you are using SystemJS, you should adjust your configuration to point to the UMD bundle.
In your systemJS config file, map
needs to tell the System loader where to look for ngx-toggle
:
map: { '@nth-cloud/ng-toggle': 'npm:@nth-cloud/ng-toggle/dist/bundles/ng-toggle.js', }
Supported browsers
We support the same browsers and versions supported by both Bootstrap 4 and Angular, whichever is more restrictive. See this for up-to-date Angular browser support.
- Chrome (45+)
- Firefox (40+)
- IE (10+)
- Edge (20+)
- Safari (7+)
Also, check Bootstrap 4's notes on supported browsers.
Big Thanks
Cross-browser Testing Platform and Open Source <3 Provided by Sauce Labs