Очистить/Сбросить материал AngualrJS <md-autocomplete>

Question

Хочу сбросить <md-autocomplete> контроль в материале AngularJS.

https://material.angularjs.org/latest/#/demo/material.components.autocomplete 
https://material.angularjs.org/latest/#/api/material.components.autocomplete/directive/mdAutocomplete 

В принципе, я хочу восстановить его в исходное состояние. Я могу получить ng-model & назначить null. Но он не удаляет отображаемый текст, содержащийся в атрибуте md-item-text.

Может понравиться кому-то, дайте мне знать, как я могу решить то же самое.

Answer 1

Вам нужно очистить текст для поиска, посмотрите на эту codepen: http://codepen.io/anon/pen/QbGZWP?editors=101

Я создал кнопку, которая вызывает функцию очистки:

function clear() { 
    self.selectedItem = null; 
    self.searchText = ""; 
} 

Эти атрибуты, установленные на md-autocomplete Директива:

<md-autocomplete 
    md-selected-item="ctrl.selectedItem" 
    md-search-text="ctrl.searchText" 
    md-items="item in ctrl.querySearch(ctrl.searchText)" 
> 

Примечание: Возможно, вам понадобятся и другие атрибуты, в зависимости от вашего случая.

Answer 2

Установите md-min-length = "1", чтобы сделать четкую работу без дополнительной функции или кнопки.

Answer 3

Вы можете использовать md-selected-item-change, чтобы справиться с этим. , например

<md-autocomplete flex 
     md-item-text="item.Text" 
     md-items="item in data" 
     md-search-text-change="query(searchText)" 
     md-search-text="searchText" 
     md-selected-item="selectedItem" 
     md-no-cache="false" 
     md-input-minLength="2" 
     md-input-name="exampleAutocomplete" 
     md-selected-item-change="addSelectedItem();" 
     md-floating-label="Nereye"> 
      <md-item-template> 
       <span md-highlight-text="searchText">{{item.Text}}</span> 
      </md-item-template> 
      <md-not-found>No matching were found were "{{searchText}}".</md-not-found> 
    </md-autocomplete> 

и вашей стороне контроллера, вы должны определить функцию с именем «addSelectedItem» и назначить SearchText с пустой строкой. как;

$scope.addSelectedItem = function() { 
      $scope.searchText = ''; 
}; 

это работает для меня. надеюсь, это поможет вам решить вашу проблему.