Angular js输入框输入并暂停答案

【问题标题】：Angular js input box typing and pausedAngular js输入框输入并暂停
【发布时间】：2016-09-01 05:27:54
【问题描述】：

我是 Angular js 的新手，并且使用带有 Angular js 的 xmpp 服务，我有一种情况，当用户开始在输入框中输入时我需要发送输入并在用户停止输入时暂停。

我有一个基本的想法，我需要使用 $timeout，并且有一个变量，例如 vm.isTyping = false;

我也为此编写了某种平台。

vm.isTyping = false;
vm.checkTyping = function(){
    $timeout(function() {
        vm.isTyping = true;
    },2000);

    if(!vm.isTyping){
        vm.sendTyping();
    } else{
        //
    }
};

这是输入域代码：

<input type="text" placeHolder="Type a message here" 
    ng-model="vm.newMessage" 
    ng-blur="focusRemove(vm.newMessage,vm.contact)" 
    ng-change="vm.checkTyping()"
    ng-model-options="{'debounce': 500}" 
    ng-keydown="vm.onKeyDown($event)" auto-focus />

我面临的问题是，我无法在用户每次按下任何键时都发送打字，第一次按键时发送一次打字，然后当用户停止打字时我应该发送暂停。

谁能帮我用angular js实现代码来实现这一点。

【问题讨论】：

我认为你需要使用 watch 和 remove debounce。
您是否只想跟踪用户是否正在输入？或者您是否尝试在用户类型时加载数据，例如过滤搜索或类似的东西？
我只想知道用户何时打字，如果他正在打字，我需要将“打字”发送到服务器，因此如果他停止打字，我需要发送“暂停”

标签： angularjs settimeout

【解决方案1】：

您可以尝试在input 标签中包含ng-keyup 属性。所以当用户开始输入你设置标志vm.isTyping = true。当用户停止输入时，您的ng-keyup 处理程序中有一个timeout，它将在一段时间后设置vm.isTyping = false。请参考以下代码片段

function myappCtrl($scope, $timeout) {
    var timoutPromise = null;
		$scope.newMessage = "";
    $scope.isTyping = false;
    
    $scope.checkTyping = function() {
    	$scope.isTyping = true;
      if(timoutPromise) {
          $timeout.cancel(timoutPromise);
      }
    }
    
    $scope.stoppedTyping = function() {
    	timoutPromise = $timeout(function() {
        $scope.isTyping = false;
      }, 2000)
    	
    }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
 <div ng-controller="myappCtrl">
  <input  type="text" placeHolder="Type a message here" ng-model="newMessage" ng-change="checkTyping()"  ng-keyup="stoppedTyping()"/>
  <div ng-if="isTyping">
    typing
  </div>
</div>
</div>

【讨论】：