输入输入时Angularjs暂停

时间:2021-06-09 03:39:43

Right now I am using jQuery to figure out when an input has started typing and then paused.

现在我正在使用jQuery来确定输入何时开始输入然后暂停。

var timeoutId;
$('#container').on('input propertychange change', 'form', function(e) {
    clearTimeout(timeoutId);
    timeoutId = setTimeout(function() { 
        console.log("paused");
    }, 3000);
});

I'm trying to find an appropriate Angularjs solution to accomplish this task.

我正在尝试找到一个合适的Angularjs解决方案来完成这项任务。

I'm thinking I need to use ng-change or something similar to my input areas but I'm new to angular and any suggestions would be greatly appreciated.

我想我需要使用ng-change或类似于我输入区域的东西,但我是棱角分明的新人,任何建议都会非常感激。

2 个解决方案

#1


2  

Found out the answer. You would do this where 3000 is the amount of milliseconds you want to wait.

找到答案。你会这样做,其中3000是你想要等待的毫秒数。

<input ng-change="functionToRun()" ng-model-options="{debounce: 3000}" />

#2


0  

Edit: @bryan has the correct answer!

编辑:@bryan有正确的答案!

You can use the ng-change directive on your inputs and the $timeout service to handle your pause event.

您可以在输入和$ timeout服务上使用ng-change指令来处理暂停事件。

Working plunker:

http://plnkr.co/edit/Y6NtjabxeGaQpOIif1U3?p=preview

<body ng-app="inputExample">
  <script>
    angular.module('inputExample', [])
      .controller('ExampleController', ['$timeout', '$scope', function($timeout, $scope) {
        $scope.checkPause = function() {
          $timeout.cancel($scope.pause);
          $scope.pause = $timeout(function() {
            alert("pause");
          }, 1000);
        };
      }]);
  </script>
  <div ng-controller="ExampleController">
    <form name="myForm">
      <label>
        User name:
        <input ng-change="checkPause()" type="text" name="userName" ng-model="user.name" required>
      </label>
    </form>
  </div>
</body>

#1


2  

Found out the answer. You would do this where 3000 is the amount of milliseconds you want to wait.

找到答案。你会这样做,其中3000是你想要等待的毫秒数。

<input ng-change="functionToRun()" ng-model-options="{debounce: 3000}" />

#2


0  

Edit: @bryan has the correct answer!

编辑:@bryan有正确的答案!

You can use the ng-change directive on your inputs and the $timeout service to handle your pause event.

您可以在输入和$ timeout服务上使用ng-change指令来处理暂停事件。

Working plunker:

http://plnkr.co/edit/Y6NtjabxeGaQpOIif1U3?p=preview

<body ng-app="inputExample">
  <script>
    angular.module('inputExample', [])
      .controller('ExampleController', ['$timeout', '$scope', function($timeout, $scope) {
        $scope.checkPause = function() {
          $timeout.cancel($scope.pause);
          $scope.pause = $timeout(function() {
            alert("pause");
          }, 1000);
        };
      }]);
  </script>
  <div ng-controller="ExampleController">
    <form name="myForm">
      <label>
        User name:
        <input ng-change="checkPause()" type="text" name="userName" ng-model="user.name" required>
      </label>
    </form>
  </div>
</body>