angular2日期滑块组件打字稿

Question

Does anyone know of any slider components that work with dates for angular2? Or a way I could adapt an existing slider that may not work with dates to be able to work with dates? Thank you!

Answer 1

尝试使用primeng https://www.primefaces.org/primeng/#/slider的组件

Answer 2

Make this try in Angular2 Material slider .

and set max and min for your date of start and end.Next,get change of @output then convert to your date.

html

<md-slider thumbLabel min="0" [max]="datediff" (change)="getchange($event)" ></md-slider>

<p>{{nowchoose}}</p>
<!-- now choose is support date to parse what you want.-->

ts

getchange($event){
  this.nowchoose = new Date($event.value*24*60*60*1000).getTime();
  this.nowchoose= new Date(this.datestart.getTime() + this.nowchoose );  
}
constructor(){
  this.datestart = new Date("1911-1-1");
  this.datesend = new Date("2017-1-1");
  this.datediff=(this.datesend- this.datestart)/24/60/60/1000;
}