How to show value while sliding the range slider in ionic framework?

Question

I want my code to show the range value (on the slider itself) while I am sliding the slider in my ionic app.

My slider code is:

    <h5>Scale</h5>
    <div class="item range">
        <i>1</i>
        <input type="range" id="inputRange" name="volume" min="1" max="10">
        <i>10</i>
    </div>

What changes are required in my code?

Answer 1

In ionic 3, I have achieved it like this.

<ion-badge>{{knobValues}}</ion-badge>
<ion-range min="1" max="100" step="1" [(ngModel)]="knobValues"></ion-range>