2017-06-01 2 views
0

md-separatorキーを使用してmd-chipを使用すると動作します。 md-autocompleteを追加すると、md-separator-keysは機能しません。md-chipを作る方法md-separator-keysはmd-autocompleteと一緒に動作しますか?

私はそれを使用する方法をこの:

<md-chips ng-model="chips.selectedChips" md-add-on-blur="true" md-separator-keys="customKeys" 
      md-transform-chip="chips.transformChip($chip)" 
      md-require-match="chips.allowToAddNew" md-autocomplete-snap> 
    <md-autocomplete 
     md-selected-item="chips.selectedItem" 
     md-search-text="chips.searchText" 
     md-items="item in chips.querySearch(chips.searchText)" 
     md-item-text="chips.getText(item)" 
     placeholder="{{ field.hint }}"> 
    <span md-highlight-text="chips.searchText">{{ chips.getText(item) }}</span> 
    </md-autocomplete> 
    <md-chip-template> 
    <span>{{ chips.getText($chip) }}</span> 
    </md-chip-template> 
</md-chips> 

customKeysは、次のように初期化されます:

scope.customKeys = [ $mdConstant.KEY_CODE.ENTER, $mdConstant.KEY_CODE.COMMA, 186 ]; 

質問です:それを動作させるためにどのように?

p.s.何らかの理由でadd-on-blurがうまく動作しない場合は、修正方法を見つけることも良いでしょう。

p.p.s.私はgithub上でCLOSED issueが見つかったので、この有効な問題を修正するつもりはありません。魅力的な

答えて

0

私はそれが完璧な解決策ではなく、むしろ回避策であることを知っています。 この私は私のカスタムディレクティブのリンク方式に追加したもの:

scope.$watch('chips.searchText', function(newValue, oldValue) { 
    if (!newValue || newValue.length < 2) { 
     return; 
    } 
    if (";,".indexOf(newValue.substring(newValue.length - 1)) < 0) { 
     return; 
    } 

    var chipName = newValue.substring(0, newValue.length - 1); 
    if (!scope.chips.selectedChips) { 
     scope.chips.selectedChips = []; 
    } 
    scope.chips.selectedChips.push(scope.chips.transformChip(chipName)); 
    scope.chips.searchText = ''; 
}); 

そして、それは完全に冗長になったので、私はmd-chipsからmd-separator-keysを削除

関連する問題