<div range-slider min="minPrice" max="maxPrice" modelmin="userMinPrice" model-max="userMaxPrice" step="5" ng-model="selectedPrice" ng-change="price()"></div>
如何在角度範圍滑塊值更改並調用function.ngchange時觸發事件不起作用。如何在角度範圍滑塊中添加事件。我使用ngchange但它不起作用
<div range-slider min="minPrice" max="maxPrice" modelmin="userMinPrice" model-max="userMaxPrice" step="5" ng-model="selectedPrice" ng-change="price()"></div>
如何在角度範圍滑塊值更改並調用function.ngchange時觸發事件不起作用。如何在角度範圍滑塊中添加事件。我使用ngchange但它不起作用
在這裏你去,看看下面的代碼:
angular.module('myApp', ['ui-rangeSlider'])
.controller('MyController', function($scope) {
$scope.rangeSlider = {
minPrice: 10,
maxPrice: 100
}
$scope.userMinPrice = 50;
$scope.userMaxPrice = 80;
$scope.$watch('userMinPrice', function(newVal, oldVal) {
if (newVal !== oldVal) {
$scope.message = 'userMinPrice has changed from ' + oldVal + ' to ' + newVal;
// To whatever you want here.
}
});
$scope.$watch('userMaxPrice', function(newVal, oldVal) {
if (newVal !== oldVal) {
$scope.message = 'userMaxPrice has changed from ' + oldVal + ' to ' + newVal;;
// To whatever you want here.
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://danielcrisp.github.io/angular-rangeslider/angular.rangeSlider.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<script src="http://danielcrisp.github.io/angular-rangeslider/angular.rangeSlider.js"></script>
<div ng-app="myApp" ng-controller="MyController">
<div range-slider min="rangeSlider.minPrice" max="rangeSlider.maxPrice" model-min="userMinPrice" model-max="userMaxPrice" step="5">
</div>
<div> {{ message }} </div>
</div>
我得到的解決方案。按手柄上的向上
<div range-slider min="minPrice" max="maxPrice" model-min="userMinPrice" model-max="userMaxPrice" step="5" ng-model="selectedPrice" filter="currency" on-handle-up="choosePrice()"></div>
是的,這也可以達到目的。 – Gaurav
使用如果您正在使用這一個https://github.com/danielcrisp/angular-rangeslider,看着我不認爲「範圍滑塊」的文檔支持NG-'模型「或」ng-change「 – Gaurav
那麼什麼是解決方案 –
你可以添加手錶,如果你想我可以提供一個演示代碼。 – Gaurav