angular 2 nouislider：如何重新創建滑塊？

Question

我需要更改滑塊上的手柄數量。當谷歌搜索說我需要摧毀並再次創建滑塊。

現在，這裏說的：Updating and reading slider options是：

要更新任何其他選項，破壞使用 slider.noUiSlider.destroy（）滑塊，並創建一個新的。請注意，銷燬滑塊時，事件是 不會解除綁定。

我能夠摧毀滑塊：

@ViewChild('slider') slider; 

destroySlider() { 
    this.slider.slider.destroy(); 
} 

，但我似乎無法找到如何創造的角度滑塊。

任何幫助表示讚賞。

Answer 1

您可以通過*ngIf

component.html

<button (click)="reCreate()">Recreate slider</button> 

<nouislider *ngIf="flag" #slider [config]="someKeyboardConfig"></nouislider> 

包裹在EmbeddedView滑塊，然後重新創建函數可能看起來像：

component.ts

flag = true; 

reCreate() { 
    this.slider.slider.destroy(); 
    this.flag = false; 
    this.cdRef.detectChanges(); 
    this.flag = true; 
} 

Plunker Example