How to get "from" & "to" value from ION-Range-Slider in a AngularJs Controller

Question

I'am trying to get the values of "from" and "to" from a ION-Range-Slider in a AngularJS Controller, but i've got an syntaxerror.

Here is my Slider:

<div class="slider-box">
    <h5>Entfernung</h5>
    <ion-slider type="double"
        grid="true"
        min="0"
        max="800"
        step="50"
        from="{{ distance.from }}"
        to="{{ distance.to }}"
        postfix="Meter"
        disable="false">
    </ion-slider> 
</div>

---

from="{{ distance.from }}" <!-- Syntax ERROR -->
to="{{ distance.to }}"     <!-- Syntax ERROR -->

---

In my controller i've tried this:

$scope.distance = {
    from: 0,
    to: 400,
};

---

Thanks for your time :)

Answer 1

Usually you don't need the {{ }} brackets when setting the attributes on these custom components - it knows that you are referencing Angular properties. Try:

<div class="slider-box">
    <h5>Entfernung</h5>
    <ion-slider type="double"
        grid="true"
        min="0"
        max="80"
        step="50"
        from="distance.from"
        to="distance.to"
        postfix="Meter"
        disable="false">
    </ion-slider>
</div>