I'm trying to use a few different javascript libraries for a rangeslider. However, for each one I use, I do not see anything in the browser - even though I can see the HTML being generated. I have settled on using nouislider.
import { Component, ViewChild, ElementRef, OnInit, AfterViewInit} from '@angular/core';
import * as nouislider from 'nouislider';
@Component({
selector: 'app-root',
template: '<div #here></div>',
styleUrls: ['./app.component.css']
})
export class AppComponent implements AfterViewInit {
@ViewChild('here') range : ElementRef
ngAfterViewInit() {
nouislider.create(this.range.nativeElement,
{
start: [20, 80],
connect: true,
range: {
'min': 0,
'max': 100
}
});
}
}
And the result:
Is there something I am missing? This is an empty Angular 4 project. I know there are directives for nouislider which are already made. However I have also not been able to get them to work.
