радиально-самозагрузка машинописного + нг щелчок/нг-фокус

Question

В моем приложении я использую angular-bootstrap typeahead компонент, таким образом:

<input type="text" ng-model="selected" placeholder="Start typing to select an object" uib-typeahead="obj as obj.name for obj in objectList | filter:{name:$viewValue}" class="form-control" typeahead-show-hint="true" typeahead-min-length="0" /> 

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

<input ... ng-click="selected = null;" /> 

или

<input ... ng-focus="selected = null;" /> 

не работает - машинописный просто перестает работать. Есть ли решение? Спасибо.

Answer 1

Вероятно, самым простым решением было бы ввести следующую директиву для этой цели:

.directive('resetTypeahead', function() { 
    return { 
     require: 'ngModel', 
     link: function (scope, element, attrs, ngModel) { 
     element.bind('click', function (e) { 
      var viewValue = ngModel.$viewValue; 
      if (viewValue) { 
      ngModel.$setViewValue(''); 
      ngModel.$render(); 
      } 
     }); 
     } 
    } 
    }) 

Demo: plunker