darul75 / angular-awesome-slider

:arrows_clockwise: Angular slider control directive
http://darul75.github.io/angular-awesome-slider/
MIT License
144 stars 63 forks source link

We need an option to use custom template #98

Open kanagukrs opened 9 years ago

kanagukrs commented 9 years ago

Right now, we don't have an option to use our custom template for slider instead of the template provided by ng-slider

darul75 commented 9 years ago

you can use following script template into your view, inspired from https://github.com/darul75/ng-slider/blob/master/src/core/template/slider.tmpl.js

    <script type="text/ng-template" id="ng-slider/slider-bar.tmpl.html">
      <span ng-class="mainSliderClass" id="{{sliderTmplId}}">
      <table><tr><td>
        <div class="jslider-bg">
          <i class="left"></i>
          <i class="right"></i>
          <i class="range"></i>
          <i class="before"></i>
          <i class="default"></i>
          <i class="default"></i>
          <i class="after"></i>
        </div>
        <div class="jslider-pointer"></div>
        <div class="jslider-pointer jslider-pointer-to"></div>
        <div class="jslider-label"><span>{{from}}</span>{{options.dimension}}</div>
        <div class="jslider-label jslider-label-to"><span>{{to}}</span>{{options.dimension}}</div>
        <div class="jslider-value"><span></span>{{options.dimension}}</div>
        <div class="jslider-value jslider-value-to"><span></span>{{options.dimension}}</div>
        <div class="jslider-scale" id="{{sliderScaleDivTmplId}}"></div>
      </td></tr></table>
    </span>
    </script>
darul75 commented 9 years ago

but current code is heavily attached to this template.

kanagukrs commented 9 years ago

Yes, decoupling css and template from functionality will solve the problem. As of now it needs complete refactoring. I raised this because you can consider it for future development