0.0.4 • Published 6 years ago

ngx-rslide v0.0.4

Weekly downloads
1
License
MIT
Repository
github
Last release
6 years ago

ngx-rslide

Installation

To install slider, run:

$ npm install ngx-rslide --save

Using slider

You can import slider module in any Angular application by running:

$ npm install ngx-rslide --save

and then add SliderModule in your module, for example AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
// import SliderModule
import { SliderModule } from './modules/slider/slider.module';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    // Declare SliderModule in the 'imports' section of your module
    SliderModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Once slider is imported, you can use it in your Angular application:

app.component.html:

<ngx-rslide [step]="5" [min]="20" [max]="60" [(values)]="values"></ngx-rslide>

app.component.ts:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  values = [0, 50];
}

Common API

PropertyDescriptionDefaultType
@Input() minThe minimum value of the slider0number / null
@Input() maxThe minimum value of the slider100number / null
@Input() stepThe values at which the thumb will snap1number / null
@Input() valuesValues of slider[0]Array<number> / null
@Output() valuesChangeEvent emitted when the slider values has changedEventEmitter<Array<number>>

License

MIT © bezzubov egor