My HTML code is following which contains md-slider
<body ng-app="ABC">
<div class="ctrl" ng-controller="mainCtrl">
<md-slider ng-model="threshold" md-discrete min="1" max="100" aria-label="threshold"></md-slider>
</div>
</body>
This is my controller:
angular.module("ABC", ["ngMaterial"])
.controller("mainCtrl", function ($scope) {
$scope.threshold = localStorage.getItem("myExtThreshold");
});
When I slide the slider using mouse, threshold is updated in controller. However when I change threshold in controller, the slider position doesn't change. For example, if I change threshold value from 20 to 60, and I use console.log($scope.threshold) the value shown will be 60 but the md-slider remain at 20.
localStorage.getItem("myExtThreshold") returns valid numeric value.
Try this in the controller. Of course nothing wrong with your code. just making the return value to be a number