Ng2-NoUISlider получает одинаковые значения диапазона - PullRequest
Новая
       9

Ng2-NoUISlider получает одинаковые значения диапазона

0 голосов
/ 08 января 2019

Я стараюсь использовать несколько ползунков на одной странице, но по какой-то причине все ползунки получают тот же диапазон, что и значения диапазона первого ползунка. Это мой HTML: 

<div *ngFor="let property of comepleteFilters">
                <h5>{{property.propertyName}}</h5>
                <div *ngIf="setSliderValues(property); else renderCheckbox">

                  <nouislider #slider [min]="minSliderValue" [max]="maxSliderValue" [step]="stepSliderValue" [config]="conf" [tooltips]="[true, true]" (end)="onSliderChange($event)"></nouislider>

                </div>

И мой это мой файл TS: 

conf: any = {
    start: [0, 10],
    behaviour: 'drag'
  };

.. .. 

  setSliderValues(sliderFilter: FilterList) {
    if (sliderFilter.propertyName === 'enginePower' || sliderFilter.propertyName === 'wheelBase') {
      this.minSliderValue = sliderFilter.propertyValues[0];
      this.maxSliderValue = sliderFilter.propertyValues[sliderFilter.propertyValues.length - 1];
      this.stepSliderValue = 5;
      return true;
    } else {
      return false;
    }

  }

Например, первый ползунок имеет значения от 0 до 730, а второй ползунок - от 2300 до 12000. Но оба ползунка заканчиваются с диапазоном значений 0-730. Я даже пытался кодировать слайдеры с другими значениями вместо циклических, чтобы увидеть, будет ли результат отличаться, но я все еще получаю ту же проблему. Я использую Angular 6.

Ответы [ 2 ]

0 голосов
/ 09 января 2019

Нет, это не так. Даже если я жестко закодирую 2 слайдера, это вызовет ту же проблему: 

<nouislider #slider [min]="0" [max]="730" [step]="10" [config]="conf" [tooltips]="[true, true]"></nouislider>
<nouislider #slider [min]="2300" [max]="12000" [step]="100" [config]="conf" [tooltips]="[true, true]"></nouislider>

Только шаг работает правильно.

Я только что заметил, что проблема связана со мной с использованием той же переменной конфигурации. Если я использую 2 разных конфига, с одинаковыми значениями, это работает. Я что-то упустил?

0 голосов
/ 08 января 2019

Поскольку вы устанавливаете одинаковые минимальные и максимальные значения. Когда вызывается функция setSliderValues ​​(), вы устанавливаете одно значение в max и min. this.minSliderValue всегда получает значение из последнего цикла *ngFor. 

<div *ngFor="let property of comepleteFilters">
   <h5>{{property.propertyName}}</h5>
   <div *ngIf="setSliderValues(property); else renderCheckbox">
     <nouislider #slider [min]="property.propertyValues[0]" [max]="property.propertyValues[sliderFilter.propertyValues.length - 1]" [step]="stepSliderValue" [config]="conf" [tooltips]="[true, true]" (end)="onSliderChange($event)"></nouislider>
   </div>
</div>
...