Установка таймаута для функции часов AngularJS $

Question

Есть ли способ добавить тайм-аут в функцию наблюдения AngularJS $?

Например, допустим, у меня есть приведенный ниже код AngularJS, который просматривает значение, myName .Когда значение изменяется, функция слушателя запускается.Но если значение не меняется в течение определенного периода времени, я хочу, чтобы оно делало что-то еще.

В частности, в приведенном ниже коде я бы хотел, чтобы $ scope.nothingEnteredFlag изменилось с false на true.Мой HTML-шаблон должен быть настроен на отображение состояния этого флага (например, с помощью ng-show).

var app = angular.module("helloApp", []);
app.controller("helloCtrl", function($scope) {
    $scope.nothingEnteredFlag=false;
    $scope.$watch("myName", function (newValue, oldValue) {
        if ($scope.myName.length < 5) {
            $scope.message = "Short name!";
        } else {
            $scope.message = "Long name!";
        }
    });
});

См. fiddle .

Я пробовалокружая $ watch $ timeout, но не могу заставить его работать.

Answer 1

Вы можете использовать угловой тайм-аут для достижения желаемого результата.

var timer;
  var timerFunction = function() {
    timer = $timeout(function() {
      $scope.nothingEnteredFlag = true;
    }, 5000);
  };

Это создаст функцию таймера

Вашему контроллеру должно понравиться это

var app = angular.module("helloApp", []);
app.controller("helloCtrl", function($scope, $timeout) {
  $scope.nothingEnteredFlag = false;
  $scope.myName = "";
  $scope.$watch("myName", function(newValue, oldValue) {
    if ($scope.myName.length < 5) {
      $scope.message = "Short name!";
    } else {
      $scope.message = "Long name!";
    }
    $scope.nothingEnteredFlag = false;
    $timeout.cancel(timer);
    timerFunction();
  });
  var timer;
  var timerFunction = function() {
    timer = $timeout(function() {
      $scope.nothingEnteredFlag = true;
    }, 5000);
  };
  timerFunction();
});

Как вы можете видеть, мы включили тайм-аут на 5 секунд после того, как пользователь вводит любой текст, мы отменяем таймер и включаем его снова, таким образом, мы можем предложить пользователю ввести, если он ничего не написал за пятьсекунд.

Демо