我有一条指令,其中包含带有两个箭头的输入,该箭头用于递增/递减数字。
我想在用户长按时连续增加/减少数字,我该怎么做?
指示:
'use strict';
(function (module) {
var vlIncrementor = function () {
return {
templateUrl: 'assets/angular-client/app/html/common/incrementor/vlIncrementor.html',
scope: { model: '=ngModel' },
controller: function ( $scope ) {
$scope.increment = function ( ) {
$scope.model++;
};
$scope.decrement = function () {
$scope.model--;
};
}
};
};
module.directive('vlIncrementor', vlIncrementor);
}(angular.module('html.common')));
HTML:
<div class="vl-increment">
<i class="fa fa-caret-left fa-lg center" ng-class="{disabled: model === 0}" ng-click="decrement()"></i>
<input type="text" ng-model="model"/>
<i class="fa fa-caret-right fa-lg center" ng-click="increment()"></i>
</div>
我尝试使用此代码添加链接功能,但没有用(像常规点击一样增加了一个):
link: function ( scope , el) {
$(el ).find('.fa-caret-left').mouseup(function(){
clearTimeout(pressTimer)
// Clear timeout
return false;
}).mousedown(function(){
// Set timeout
pressTimer = window.setTimeout(function() {
scope.$apply( function () {
scope.model--;
});
},1000);
return false;
});
}
最佳答案
here已经回答了类似的问题。
可能的解决方案是使用ng-mousedown
和ng-mouseup
并使用$interval
控制计数器。