角度:长按增加计数器

托默尔

我有一条指令,其中包含带有两个箭头的输入,该箭头用于递增/递减数字。

我想在用户长按时连续增加/减少数字,我该怎么做?

在此处输入图片说明

指示:

'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;
                });
            }
古怪

这里已经回答类似的问题

一种可能的解决方案是使用ng-mousedownng-mouseup并用$interval来控制计数器。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章