nn

ng2-nouislider

Angular2 noUiSlider directive

Showing:

Popularity

Downloads/wk

40.3K

GitHub Stars

184

Maintenance

Last Commit

8mos ago

Contributors

29

Package

Dependencies

0

Size (min+gzip)

2.0KB

License

MIT

Type Definitions

Built-In

Tree-Shakeable

Yes?

Reviews

Top Feedback

1Easy to Use

Readme

ng2-nouislider

Build Status npm version Downloads All Contributors

Angular2 nouislider component

See demos

Install

npm i --save nouislider ng2-nouislider

Import

import { NouisliderModule } from 'ng2-nouislider';

Styles

@import "~nouislider/distribute/nouislider.min.css";

SystemJS config

Add to map:

'nouislider': 'node_modules/nouislider',
'ng2-nouislider': 'node_modules/ng2-nouislider',

Add to packages:

'nouislider': { main: 'distribute/nouislider.js', defaultExtension: 'js' },
'ng2-nouislider': { main: 'src/nouislider.js', defaultExtension: 'js' },

Usage

Using ngModel

<nouislider [connect]="true" [min]="0" [max]="15" [(ngModel)]="someRange"></nouislider>

Within reactive forms

this.form1 = this.formBuilder.group({ 'single': [ 10 ] });
<form [formGroup]="form">
    <nouislider [min]="0" [max]="20" [step]="0.5" [formControl]="form.controls.single"></nouislider>
</form>

Nouislider documentation

This component is based on nouislider. Documentation about additional settings (passed in [config] @Input) can be found here.

Start development

npm i
npm start
open http://localhost:8080

Contributors

Thanks goes to these wonderful people (emoji key):


Tomasz Bak

💻 👀

Giacomo Mazzamuto

💻 👀

Ryan Morris

💻

Sven Flickinger

💻

Riku Kallio

💻

John Pinkster

💻

Oleg Romanovskyi

💻

ATeal

💻

Jérémy Leherpeur

💻

Matt Lewis

💻

anysite

📖

flmg

💻

SirWojtek

📖

Rubén Trujillo

💻

Olena Horal

💻 💡

Jeremy Fry

💻

Tadeusz

💻

Philippe Roy

💻

This project follows the all-contributors specification. Contributions of any kind are welcome!

License

MIT

Rate & Review

Great Documentation0
Easy to Use1
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
sibaram32111 Rating0 Reviews
6 months ago
Easy to Use

Tutorials

No tutorials found
Add a tutorial