nouislider-angular

WebJar for nouislider-angular

License

License

ISC
Categories

Categories

IDE Development Tools Github Version Controls Angular User Interface Web Frameworks
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

github-com-lknop-nouislider-angular
Last Version

Last Version

v2.6.3
Release Date

Release Date

Type

Type

jar
Description

Description

nouislider-angular
WebJar for nouislider-angular
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/lknop/nouislider-angular

Download github-com-lknop-nouislider-angular

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/github-com-lknop-nouislider-angular/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>github-com-lknop-nouislider-angular</artifactId>
    <version>v2.6.3</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/github-com-lknop-nouislider-angular/
implementation 'org.webjars.bower:github-com-lknop-nouislider-angular:v2.6.3'
// https://jarcasting.com/artifacts/org.webjars.bower/github-com-lknop-nouislider-angular/
implementation ("org.webjars.bower:github-com-lknop-nouislider-angular:v2.6.3")
'org.webjars.bower:github-com-lknop-nouislider-angular:jar:v2.6.3'
<dependency org="org.webjars.bower" name="github-com-lknop-nouislider-angular" rev="v2.6.3">
  <artifact name="github-com-lknop-nouislider-angular" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='github-com-lknop-nouislider-angular', version='v2.6.3')
)
libraryDependencies += "org.webjars.bower" % "github-com-lknop-nouislider-angular" % "v2.6.3"
[org.webjars.bower/github-com-lknop-nouislider-angular "v2.6.3"]

Dependencies

compile (2)

Group / Artifact Type Version
org.webjars.bower » github-com-lknop-nouislider jar 8.5.2
org.webjars.bower : angular jar [1.4.11,1.5)

Project Modules

There are no modules declared in this project.

nouislider-angular

Check demo at http://yankovsky.github.io/nouislider-angular/examples

You can pass any nouislider options options to ya-no-ui-slider directive.

Installation

Install with NPM

npm install nouislider-angular

Install with Bower

bower install nouislider-angular

Basic usage

angular.module('sampleApp', ['ya.nouislider'])
  .controller('SampleCtrl', function($scope) {
    $scope.options = {
        start: [20, 70],
        range: {min: 0, max: 100}
    }
})
<div ya-no-ui-slider='options'></div>

Options

Global config

You can set global configuration value yaNoUiSliderConfig and all nouislider options will inherit from it:

angular.module('sampleApp', ['ya.nouislider'])
    .value('yaNoUiSliderConfig', {step: 1})

Event handlers

$scope.eventHandlers = {
    update: function(values, handle, unencoded) {},
    slide: function(values, handle, unencoded) {},
    set: function(values, handle, unencoded) {},
    change: function(values, handle, unencoded) {}
}
<div ya-no-ui-slider='options' 
     ya-no-ui-slider-events='eventHandlers'></div>

Disable slider or individual handlers

<div ya-no-ui-slider='options' 
     ya-no-ui-slider-disabled='sliderDisabled'
     ya-no-ui-slider-handle1-disabled='handle1Disabled'
     ya-no-ui-slider-handle2-disabled='handle2Disabled'></div>

Slide event debounce

Use number to specify delay in ms or use special value "Infinity" to disable updating model on slide event.

<div ya-no-ui-slider='options' 
     ya-no-ui-slider-slide-debounce='300'></div>
     
<div ya-no-ui-slider='options' 
     ya-no-ui-slider-slide-debounce='Infinity'></div>

Development

For development use examples/index.html file and some local web server.

Building minified version

To build minified version use npm run build command.

Versions

Version
v2.6.3
v2.6.1