ngModelOptions debounce state

[klmdb]

I can't seem to find a way to update my view according to the debounce state (displaying a loading icon next to a text input that displays when the user starts to type and disappears when the debounce is done waiting).

it wouls make sense to me if, like ngModel.$pending, there could be a bool set on ngModel. Something like ngModel.$debouncing.

[Narretz]

Hm. What's the exact use case? Debouncing is mainly an instrument to improve performance, it's not something that the user needs to know about.

[klmdb]

The specific usecase I'm looking at is a registration form with a username field. While the user is typing, it should be checked if the username is unique.

Of course we want to use a debounce here to not send a new request on every keystroke. While the debounce is timing out, however, we want the submit button to be disabled, since it cannot be guaranteed that the provided username will be unique. Not disabling the button during this period results in a brief (300 ms) but real period of inconsistency.

Setting up an async validator to run the uniqueness check provides us with the $pending property on the ngModel We use this flag to disable the submit button. The debounce option doesn't provide any such way to signal it's state, however.

[klmdb]

Does this still require more info?

[Narretz]

I can see how a $debounce state might be useful. The problem is that debounce delays the digest until the timer has run out. If we have a $debounce state, we would need another digest when a debounce is first started, to update the scopes. This would weaken the performance improvements gained by the debounce. I am not sure this will make it into angular 1, but it's definitely something to keep in mind for future versions,

[Narretz]

Here's a plnkr that shows a directive that adds this state: http://plnkr.co/edit/PV6X26NvRyMASDB9b5OB?p=preview

It's missing a few parts (propagating to parent form ..), but if you really need it, it's definitely possible to implement it.

[klmdb]

Thanks, that looks like something I could get to work with!

While I'm no expert at angular performance issues and haven't much a clue about angular internals in general, I still think a $debounce state should be available. It seems like bad practice to have a hanging state like that.

Anyway, thanks for the help!