4

我试图在用户停止输入后短暂延迟后调用一个函数，但clearTimeout()似乎并没有按照我的想法做。以下内容位于 Angular JS 控制器中。

$scope.typing = false;
$scope.delay = undefined;

//Triggered by ng-keydown...
$scope.startTyping = function() {
    $scope.typing = true;
            console.log('start1', $scope.delay); //6
    clearTimeout( $scope.delay );
            console.log('start2', $scope.delay); //6... NOT getting cleared!
}

//Triggered by ng-keyup...
$scope.stopTyping = function() {
    $scope.typing = false;
    $scope.delay = setTimeout( $scope.lookup, 1000);
}

$scope.lookup = function() {

    if ($scope.typing === true){
        return false;
    }
    console.log('lookup'); //This fires after every key!

我lookup在日志中看到每个键，而不是在每次延迟之后。为什么是这样？

更新

记录值后delay，很明显clearTimeout()没有重置计时器，而是设置了多个计时器，每个计时器都在触发查找功能。

以供参考...

对于其他人进行故障排除clearTimeout()，这里有一些类似的问题可能会解决您的问题（但没有解决我的问题）：

清除超时不起作用

清除超时（）不工作

清除超时不起作用

清除超时不起作用

4

2 回答 2

3

http://jsfiddle.net/coma/y52Q2/1/

控制器

app.controller('Main', function ($scope) {

    var delay;

    var lookup = function() {

        console.log($scope.input);
    };

    $scope.lookup = function() {

        clearTimeout(delay);
        delay = setTimeout(lookup, 1000);
    };
});

看法

<div ng-controller="Main">
    <input ng-model="input" ng-change="lookup()"/>
</div>

上/下尝试的问题是stopTyping被调用的次数多于startTyping：

http://jsfiddle.net/coma/5hFjY/1/

于 2013-12-23T14:06:12.060 回答
1

我会这样做：http: //jsfiddle.net/TN6zA/2/

$scope = {};

    //on keydown...
    document.getElementById("foo").onkeydown = function() {    
        clearTimeout( $scope.delay );
        $scope.delay = setTimeout( $scope.lookup, 1000);
        document.getElementById("myDiv").innerHTML = "Someone is typing";
    }

    $scope.lookup = function() {
        document.getElementById("myDiv").innerHTML = "Nobody is typing";
    }

    $scope.lookup();
于 2013-12-23T14:11:52.920 回答