0

NoUiSlider (Yankovskyディレクティブ)を使用して、数値の配列のエディターを実行しようとしています。

基本的な機能を作成することはできましたが、バインドに苦労しています。

私は次のような配列を持っています:

vm.myNumbers = [1, 2, 6];

ただし、このディレクティブには、オブジェクト全体として設定するオプションが必要です。

vm.options = {
  start: 3,
  connect: 'lower',
  range: {
    min: 0,
    max: 10
  }
};

下の図のように、配列の各要素のスライダーを作成し、その値を自動的に更新したいと思います。

ここに画像の説明を入力

問題は、 NoUiSlider ディレクティブに値のスタンドアロン バインディングがないことです。

これが私の現在のコードを示すPlunkerです: http://plnkr.co/edit/ljm96tdcGgvwo3Hnayfk?p=preview

配列からアイテムをバインドして、残りのオプションをそのオプション オブジェクトに保持することはできますか?

4

2 に答える 2

-1

私は nouislider-angular の著者です。問題http://yankovsky.github.io/nouislider-angular/examples/#/multiple-sliders-bindingに解決策の例を追加しました。

$scope.$watchCollection を使用して、スライダーの値に変更があるかどうかを確認しました。

$scope.$watchCollection(function() {
    return that.slidersOptions.map(function(options) {
        return options.start;
    })
}, function(newValue) {
    that.numbers = newValue;
});

それがあなたのために働くなら、私に知らせてください！

于 2016-06-11T15:17:42.727 に答える