すべてのチップが削除された後、オートコンプリート提案が表示されない（md-chips + md-autocomplete）

Question

私の例では（https://jsfiddle.net/vv18yjzo/7/）、mdチップの入力が集中している限り、オートコンプリート提案が表示されます。これはいくつかの項目を入力するとうまくいきます。 ただし、利用可能なアイテムがすべて追加されて削除されると、オートコンプリート候補は空/非表示になります。私は新しい検索テキストを入力して、オートコンプリート提案をもう一度表示する必要があります。

HTML：

<md-input-container class="md-block"> 

    <label>Categories</label> 

    <md-chips ng-model="vm.selectedCategories" 
     md-autocomplete-snap 
     md-require-match="true" 
     md-on-add="vm.onCategoryAdded($chip, $index)" 
     md-on-remove="vm.onCategoryRemoved($chip, $index)"> 

     <md-autocomplete 
      md-selected-item="vm.autocomplete.selectedItem" 
      md-search-text="vm.autocomplete.searchText" 
      md-selected-item-change="vm.onSelectedItemChanged()" 
      md-search-text-change="vm.onSearchTextChanged()" 
      md-items="item in vm.searchCategories()" 
      md-item-text="item.name" 
      md-min-length="0" 
      md-select-on-match="true" 
      md-match-case-insensitive="true" 
      md-no-cache="true" 
      placeholder="Choose categories"> 

      <span md-highlight-text="vm.autocomplete.searchText" 
       md-highlight-flags="i">{{item.name}}</span> 

     </md-autocomplete> 

     <md-chip-template> 
      <span> 
       <strong>{{$chip.name}}</strong> 
      </span> 
     </md-chip-template> 

    </md-chips> 

</md-input-container> 

JS：

(function() { 
    'use strict'; 

    angular 
     .module('app', [ 
      'ngMaterial', 
      'ngMessages' 
     ]) 
     .factory('CategoriesService', CategoriesService) 
     .controller('CategoriesCtrl', CategoriesCtrl); 

    function CategoriesService($q, $timeout) { 

     var that = { 
       find: find 
      }, 
      categories = [ 
       { name: 'a' }, 
       { name: 'ab' }, 
       { name: 'abc' }, 
       { name: 'abcd' }, 
       { name: 'abcde' }, 
       { name: 'abcdef' } 
      ]; 

     function find(search, selectedCategories) { 
      var deferred = $q.defer(), 
       result = categories.filter(function(category) { 
        return (-1 === selectedCategories.indexOf(category) && -1 !== category.name.indexOf(search)); 
       }); 

      $timeout(function() { 
       deferred.resolve(result); 
      }, 100); 

      return deferred.promise; 
     } 

     return that; 
    } 

    function CategoriesCtrl($scope, CategoriesService) { 
     var vm = this; 

     vm.selectedCategories = []; 
     vm.autocomplete = { 
      selectedItem: null, 
      searchText: null 
     }; 

     /* ... */ 

     vm.searchCategories = function() { 
      return CategoriesService.find(vm.autocomplete.searchText.toLowerCase(), vm.selectedCategories); 
     }; 

    } 

})(); 

例：https://jsfiddle.net/vv18yjzo/7/

Answer 1

あなたはそれだけで設定解除項目を削除した場合、オートコンプリートの検索テキストとの奇妙なバグがあるようですsearchtext変数は、オートコンプリートイベントを解除します。

チェックこの作業フィドルhttps://jsfiddle.net/mgsLkf89/3/

vm.onCategoryRemoved = function($chip, $index) { 
    if (!vm.autocomplete.searchText) 
    vm.autocomplete.searchText=null; 
};