Angularjs debounce очищает мой радиовход

0

У меня есть следующая группа переключателей:

<input type="radio" name="GROUP" ng-model="data1" id="for1" value="value" ng-change="formSubmit()" ng-model-options="{debounce: 3000}">
<input type="radio" name="GROUP" ng-model="data2" id="for2" value="value" ng-change="formSubmit()" ng-model-options="{debounce: 3000}">

Как вы можете видеть, на ng-click я запускаю определенную функцию, но также имею debounce чтобы произойти только с 3-секундным таймаутом.

Когда у меня есть ng-model-options="{debounce: 3000}", очень часто мои радиогруппы будут uncheck-, что означает, что вход в группу не будет проверен.

Когда я удаляю debounce, эта проблема не возникает.

Кто-нибудь знает, как я могу это исправить?

Теги:
angular-ngmodel
debouncing

2 ответа

0
Лучший ответ

Основываясь на комментариях выше, и если вы хотите сохранить первый щелчок и проигнорировать последующие в течение 3-секундной задержки, я бы предложил:

<input type="radio" ng-change="doItLater();" value="X">

(тем временем, в директиве:

scope.doItLater = function() {
    if (scope.timeoutwatcher !== undefined) {return;}
    scope.timeoutwatcher = $timeout(function() {
        // do it
        delete scope.timeoutwatcher;
    },3000);
}

Или если вы хотите, чтобы более поздние клики в течение периода ожидания перекрывали предыдущие,

scope.doItLater = function() {
    $timeout.cancel(scope.timeoutwatcher);
    scope.timeoutwatcher = $timeout(function() {
        // do it
    },3000);
}
  • 0
    для второго я получаю, Error: Can't find variable: $timeout
  • 0
    вам нужно ввести $ timeout как зависимость. docs.angularjs.org/api/ng/service/$timeout
0

что-то вроде этого может помочь

angular
    .module('app', [])
    .controller('example', ['$scope', function($scope) {
        $scope.user = {};
        $scope.$watch('user.gender', $scope.callback);
        $scope.callback = function() {
            alert($scope.user);
        }
    }]);

и в html так что-то вроде

  <form ng-app="app" ng-controller="example">
    <input name="jim" type="radio" ng-model="user.gender" value="male" ng-model-options="{debounce: 3000}" />male
    <input name="jim" type="radio" ng-model="user.gender" value="female" ng-model-options="{debounce: 3000}" />female
    <br />
  <pre>form = {{user | json}}</pre>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню