1

Angular アプリで noUislider を使用しています。スライダーの値は入力テキストにバインドされ、その逆も同様です。したがって、ユーザーには、値を入力してそれに応じてスライダーを調整するか、ユーザーがスライダーをスライドさせるかのいずれかを選択できます。

私が直面している問題は、スライダーの範囲が 0 ～ 24 であり、要件に従って、ユーザーが値 > 24 (スライダーの最大値) を入力できることです。スライダーは最大値に移動しますが、ユーザーが入力テキストに入力した値 (つまり 26) を保持することが期待されます。

それが可能かどうかさえわかりません。この点でどんな助けでも大歓迎です。

noUiSlider.create(element, {
                    start: ngModelCtrl.$modelValue || setupParams.defaultValue,
                    step: steps,
                    range: {
                        'min': min,
                        '50%': [average, steps],
                        'max': max
                    },
                    pips: {
                        mode: 'count',
                        values: 3,
                        density: 5,
                    },

                });
4

2 に答える 2

1

上記のフランクの投稿で問題の解決策を見つけました。私はカスタム実装を書きましたが、それは機能します。以下は私がしたことです

element.noUiSlider.on('slide', function (value, handle) {
                    inputVal = null;
                });

                element.noUiSlider.on('update', function (value, handle) {
                    if (inputVal == null) {
                        ngModelCtrl.$setViewValue(parseFloat(value), 'test');
                    }

                    if ((inputVal > min) && (inputVal < max)) {
                        ngModelCtrl.$setViewValue(parseFloat(value), 'test');
                    }
                });
于 2015-10-21T21:20:44.903 に答える
0

noUISlider のset関数を使用して値 (入力フィールドなど) に基づいてスライダーを更新する場合、いくつかのチェックが値に適用され、スライダーの下限または上限に自動的に設定されます。スライダーを設定しますが、元の入力フィールドを「修正された」値で (再) 設定します。

イベント ( https://refreshless.com/nouislider/events-callbacks ) を確認しましたが、updateおよびsetイベントには修正された値しか含まれていないため、これらのイベントが発生した後に手動で設定するオプションもありません。

残念ながら、あなたが望むものを達成することは不可能のようです。

于 2015-10-21T20:42:50.383 に答える