NgxSliderModule

There are a few options on how to include NgxSliderModule into your Angular project.

Install from NPM

Install the NgxSlider module from the command prompt from the root directory of the project:

yarn add ngx-slider --save

Import the NgxSlider module in your Angular module file (e.g., app.module.ts):

import { NgxSliderModule } from 'ngx-slider';

Add the NgxSlider module to the imports array:

@NgModule({
declarations: [ /* your components */ ],
imports: [
    BrowserModule,
    NgxSliderModule,
    // other imports
],
providers: [],
bootstrap: [AppComponent]
})

Below is an example of how to use the NgxSlider in your component:

HTML

<ngx-slider [(value)]="sliderValue" [options]="sliderOptions"></ngx-slider>

JavaScript (in your component file):

import { Component } from '@angular/core';
            
@Component({
    selector: 'app-slider',
    templateUrl: './slider.component.html',
})
export class SliderComponent {
    sliderValue: number = 50; // Default value
    sliderOptions: any = {
        floor: 0,
        ceil: 100,
        step: 1,
    };
}

Make sure to refer to the official documentation for further customization options.