角度範圍滑塊jQuery插件

很喜歡這滑塊，因爲它比jQuery UI的滑塊的微小的，已建成的觸摸控制。這真的很好。

所以我創建了一個過濾數據列表並且工作正常的指令。我需要知道的是一種即時更改範圍值的方法。所以當數據進入時，我會得到一個新的低和/或高值並更新範圍。

這裏是指令的快速，基本Plunker我使用

所以不知道這是一個角的事情，或者插件的東西。每當我得到一個新的值時，是否可能實例化該指令？

所以想聽聽你的想法。

乾杯湯姆

2013-10-20 Leads

你最好的辦法是讓你的滑塊作爲指令的範圍變量的範圍。然後監聽此變量發生的任何更改並更新滑塊。

return { 
    restrict: 'A', 
    scope: { 
    values: '=ngModel', 
    boundaries : '=' // the range of the slider 
    },

，然後在那裏你聽更改部分：

scope.$watch('boundaries', function(oldVal, newVal) { 
    if(scope.slider !== null) { 
    remove(); 
    } 
    create(); 
});

你可以看到一個工作示例here

PS：

這可以通過以下操作來實現可惜沒有簡單的方法來更新noUiSlider的範圍。這就是爲什麼我最終在diretive的元素內部創建一個內部div。

2013-10-20 19:40:54

抱歉跳到這裏。你寫的這個指令非常好，你有可能擴展它來處理「handles」選項嗎？我試圖通過在「handles：scope.handles」中添加它來添加它，但我不確定在change函數中發生的邏輯。 – flashpunk

@flashpunk該plunker已更新，以適應句柄屬性。希望它會有所幫助 –

回答