Slider tick labels missing for kendo-angular-ui

[Lance]

I'm trying out the native Angular 4 components, and I'm starting with the Slider. I was really surprised not to have value labels for the ticks. You can see that in the current documentation: http://www.telerik.com/kendo-angular-ui/components/inputs/slider/

Not having them as the default wouldn't surprise me much, but there doesn't seem to be a way to turn them on on the API: http://www.telerik.com/kendo-angular-ui/components/inputs/api/SliderComponent/

The slider in kendo-ui had this feature. Am I just missing something?

[Lance]

Also, how would I change the color of the tick? Our app has a grey background, and the tick is barely visible. It was much darker in kendo-ui, so it wasn't a problem, but I don't see how to change the color to provide sufficient contrast with the background I'm using.

[Dimiter Topalov]

Hi Lance,

Indeed, the designed behavior of the Kendo UI for Angular Slider component is to show the tick values on hover only. The value that is shown in the tooltip can be customized via the "title" input.

The tick background color is actually coming from an image. You can inspect the tick in the browser developer tools (screenshot attached), and override the relevant CSS as necessary, e.g.:

styles: [`
      >>> .k-slider-horizontal .k-tick {
        background-image: url(...)
      }
    `]

For any features and/or enhancements that you feel might improve the quality of our product, please submit a feature request to our UserVoice portal:

http://kendoui-feedback.telerik.com/forums/555517-kendo-ui-for-angular-feedback

It is closely monitored, and helps prioritize, based on customer demand when updating our roadmap. Thank you in advance.

Regards,
Dimiter Topalov
Progress Telerik

[Lance]

For anyone who may come across this post, I've since learned that to get tick labels you need to have the [largeStep] attribute set on the slider control and they appear.