-1

ion.rangeslider在我的角度应用程序中使用它,它显示得很好。但是我怎样才能得到的值,silder我需要动态更新滑块的最小值和最大值。

我在 SO 中看到了一些问题,例如ion-rangeslider not getting displayedion RangeSlider: customize grid in case of custom values。其他一些解决方案,但他们没有帮助我。

我的html如下

<div class="form-group">
      <input ionSlider id="sliderData" type="text" data-min="2000" data-from="2000" data-max="2800" data-type="single"
        data-step="5" data-prefix="$ " data-prettify="false" data-hasgrid="true" (onChange)="ionSliderForValues($event)">
    </div>

零件

ionSliderForValues(event:any){
    console.log(event);
  }

是否有任何其他方法来获取滑块的值或任何机会以角度方式获得。建议我你会得到很好的回报,谢谢。

4

1 回答 1

1

在@Ravikumar 建议的ng2-ion-range-slider的帮助下,我找到了一种方法。我觉得在 SO 中没有与此相关的答案。这就是为什么我在这里为其他陷入同样问题的人发布我的答案

对于 npm 安装和导入,请遵循ng2-ion-range-slider文档

组件.html

   <div class="form-group">
            <ion-range-slider #sliderElement type="single" [min]="myMinVar" [max]="myMaxVar" grid_num="10" prefix="$ "
              [from]="currentValue" (onChange)="myOnChange($event)"></ion-range-slider>
   </div>

组件.ts

  myOnChange(event: any) {
     console.log(event.from);
  }

range您可以通过在组件中添加变量并将它们分配为属性来动态更改滑块的最小值和最大值。

于 2018-11-28T05:37:48.563 回答