Angularjs debounce для нескольких событий не работает

Я просматривал документацию Angular для обработки форм и нашел очень полезный пример для захвата обновления в любом поле / элементе управления с задержкой. Ниже приведен пример кода, предоставленного Angularjs:

<input type="text" ng-model="user.name" ng-model-options="{ debounce: 250 }" /><br />

Работает нормально. Но они упомянули, что debounce может использоваться с несколькими событиями и предоставлен другой пример, например:

<input type="text" ng-model="user.name" ng-model-options="{ updateOn: 'default blur', debounce: { default: 500, blur: 0 } }" /><br />

Проблема этого примера в том, что он всегда задерживает обновление независимо от того, покидаете ли вы поле / элемент управления или нет. Принимая во внимание, что в этом случае он должен немедленно обновить модель, когда пользователь покидает поле / элемент управления как debounce 0 в случае blur,

Вот ссылка для запуска примера в Plunker.

Может кто-нибудь объяснить это поведение.

2 ответа

Решение

Я считаю, что вы стали жертвой преобразования типов Javascript, в частности, что 0 является false, Извлеките унифицированный источник для Angular 1.3.0-beta7, строка 18305:

var debounceDelay = ctrl.$options && (isObject(ctrl.$options.debounce)
    ? (ctrl.$options.debounce[trigger] || ctrl.$options.debounce['default'] || 0)
    : ctrl.$options.debounce) || 0;

Soif вы указали options.debounce он попытается установить debounceDelay первым options.debounce.blur, как вы ожидали. Но так как это 0 (false), он продолжается с ... || ... в ctrl.$options.debounce['default'], который не равен нулю (true) и устанавливает это значение!

В качестве обходного пути вы можете указать точное имя события, которое запускает значение по умолчанию (keyup?), или укажите небольшое, но ненулевое значение для вашей задержки, например 1:

debounce: { default: 500, blur: 1 }

Я думаю, что это должно быть подано как ошибка в Angular.

В моем случае нужно было указать updateOn вместе с debounce объект, вот так:

<textarea
    ng-model="$ctrl.notes"
    ng-model-options="{ updateOn: 'default blur', debounce: { 'default': 500, 'blur': 0 } }">
</textarea>
Другие вопросы по тегам