如何在控制器中知道<的值? md-slider>来自Angular Material Design的变化?
答案 0 :(得分:9)
您可以在指令
上添加ng-change<md-slider min="0" max="50" ng-model="text" ng-change="myMethod()" md-discrete></md-slider>
答案 1 :(得分:5)
我没有找到如何以正确的方式做到这一点,但您可以通过创建指令和事件来实现,例如:
.directive('testDragEnd', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
element.on('$md.dragend', function() {
console.info('Drag Ended');
})
}
}
})
然后,你必须在<md-slider>. (<md-slider test-drag-end></md-slider>).
我希望它有所帮助。
在Angular Material的git hub中,您可以执行相同的其他事件:
element
.on('keydown', keydownListener)
.on('$md.pressdown', onPressDown)
.on('$md.pressup', onPressUp)
.on('$md.dragstart', onDragStart)
.on('$md.drag', onDrag)
.on('$md.dragend', onDragEnd);
答案 2 :(得分:1)
我在滑块上使用了$ watch:
$scope.$watch(
function() {
return $scope.tex;
},
function(newValue, oldValue) {
$mdToast.show($mdToast.simple().content("Slider=" + newValue).position("top right").hideDelay(1500));
});
就我而言,我的HTML看起来像这样:
<md-slider min="0" max="50" ng-model="tex" md-discrete></md-slider>
祝你好运。
答案 3 :(得分:1)
我在ng-blur
中放了一个回调函数,这对我有用。 (一开始尝试ng-change
,但这变得非常缓慢。)
示例:
<md-slider ng-model="gigabyte" ng-blur="myCallbackFunction()" id="myslider"> </md-slider>
<input flex type="number" ng-model="gigabyte" ng-blur="myCallbackFunction()" aria-controls="myslider">
答案 4 :(得分:0)
ng-mouseup
应该做到这一点。如果你想要在更新db调用之前添加逻辑(就像我一样)以确保你的值已经改变,你可以在控制器内的saveChanges()
函数中添加它。
<md-slider ng-mouseup="vm.saveChanges(vm.myModel)"></md-slider>