Как узнать, когда пользователь перестанет редактировать поле автозаполнения в angularJS

У меня есть ввод с автозаполнением angular-ui-typeahead.

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

Если пользователь не использует автозаполнение, я должен изменить текст метки, сказав, что this element will be added

<input
    ng-blur="checkIfNewProvider()" 
    ng-model="providerSelected" 
    uib-typeahead="provider as provider.name for provider in providers | filter:$viewValue | limitTo:8" placeholder="{{ 'new-product.provider.placeholder' | locate }}" 
/>

Я проверял размытие поля, был ли выбранный вариант автозаполнения или нет.

Проблема в том, что когда пользователь щелкает меню опций, которое показывает автозаполнение, срабатывает размытие, и метка меняется.

После выхода из поля снова срабатывает размытие, и текст метки фиксируется.

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


person Pablo    schedule 01.12.2015    source источник
comment
не могли бы вы создать jsfiddle с вашей проблемой? Это было бы очень полезно.   -  person DonJuwe    schedule 01.12.2015
comment
plnkr.co/edit/vk1WT3IQKOX3FhtIxfHn?p=preview Вот пример, пожалуйста, напишите на вводе и выберите из автозаполнения с помощью мыши (НЕ используя ввод)   -  person Pablo    schedule 01.12.2015


Ответы (1)


Вы можете использовать атрибут typeahead-on-select($item, $model, $label) директивы, который запускает вашу функцию при выборе элемента из раскрывающегося списка:

    <input 
        type="text" 
        ng-blur="blur()" 
        typeahead-on-select="blur()" 
        ng-model="selected" 
        uib-typeahead="provider as provider.name for provider in providers | filter:$viewValue | limitTo:8" class="form-control">

Еще одна попытка, хотя и не рекомендуемая, заключается в том, чтобы $watch проанализировать модель и проверить, соответствует ли она элементу из вашего массива.

person DonJuwe    schedule 01.12.2015
comment
Да, но на typeahead-on-select запускается после blur, так что проблема та же. Я не могу убрать размытие, иначе если текст пишет не на автодополнении, я не могу проверить - person Pablo; 01.12.2015
comment
Да, но он сразу меняется из-за typeahead-on-select. Вы пытались использовать $watcher? - person DonJuwe; 02.12.2015
comment
Правильно, но выглядит плохо. Я не знаю, что такое наблюдатель. Я поищу это. Если есть пример, пожалуйста, вставьте. Спасибо - person Pablo; 02.12.2015
comment
Использование $watcher (docs.angularjs.org/api/ng/ type/$rootScope.Scope#$watch) будет выглядеть так: plnkr.co /edit/2H4XPXInYFzd7LGIZkXJ?p=preview - person DonJuwe; 03.12.2015