angular2日期滑塊組件打印稿

Question

有誰知道任何滑塊組件與angular2的日期一起工作？或者我可以調整一個現有的滑動條，可能無法使用日期，以便能夠處理日期？謝謝！

Answer 1

組件進行此嘗試Angular2 Material slider。

並設置爲max和min爲您的開始日期和結束日期。接下來，獲得change的@output然後轉換爲您的日期。

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; 
} 

Answer 2

本使用try primeng https://www.primefaces.org/primeng/#/slider