Range Sliders

No UI Slider HTML Code
                    
<div id="ul-slider-8" class="slider-primary m-xl-r"></div>
No UI Slider TS Code
                                          
import * as noUiSlider from 'noUISlider';

slider(id: string, start: number, direction: direction = 'horizontal') {
  if (id) {
    noUiSlider.create(document.getElementById(id), {
      start: [start],
      connect: [true, false],
      orientation: direction,
      range: {
        'min': [0],
        'max': [100]
      }
    });
  }
}
NG5 Slider HTML Code
                    
<ng5-slider [(value)]="value" [options]="options"></ng5-slider>