2017-06-21 6 views
0

角度材料をバージョン1.1.1から1.1.4にアップグレードした後、MDチップは以前と同じように動作しません。md-chipsの外側をクリックして再フォーカスします

エントリに文字列を入力してから外側をクリックすると、フォーカスが入力に戻ります。

私はこれが起こりたくありません。アンギュラ材質1.1.4で

https://youtu.be/LD2CxbuMxJg

:アンギュラ材質1.1.1で

https://youtu.be/dG1kKvU1Y0s

は誰でも、私を助けてくださいことはできますか?

+0

を私はこれを再生成することができませんよ。どのブラウザを使用していますか? –

+0

[Angular Material 1.1.4](https://fiddle.jshell.net/nxvp1mdu/3/)と[Angular Material 1.1.1]のライブ例(https://fiddle.jshell.net/c1osj4p7/2/) ) –

答えて

0

mdChipsCtrlには、shouldFocusLastChipという名前のエントリにフォーカスを戻すブール変数があります。

私は、次のディレクティブでこの変数の値を変更することで機能を上書き:

angular.module('myApp').directive('mdChips', function() { 
    return {                 
    restrict: 'E',               
    require: 'mdChips', // Extends the original mdChips directive   
    link: function (scope, element, attributes, mdChipsCtrl) {    
     mdChipsCtrl.appendChip = function (newChip) { 
     // Set to FALSE         
     this.shouldFocusLastChip = false;                  

     if (this.useTransformChip && this.transformChip) {     
      var transformedChip = this.transformChip({'$chip': newChip});  

      // Check to make sure the chip is defined before assigning it, otherwise, we'll just assume 
      // they want the string version.         
      if (angular.isDefined(transformedChip)) {       
      newChip = transformedChip;          
      }                 
     }                 

     // If items contains an identical object to newChip, do not append 
     if (angular.isObject(newChip)){          
      var identical = this.items.some(function(item){     
      return angular.equals(newChip, item);       
      });                
      if (identical) return;            
     }                 

     // Check for a null (but not undefined), or existing chip and cancel appending 
     if (newChip === null || this.items.indexOf(newChip) + 1) return;  

     // Append the new chip onto our list         
     var length = this.items.push(newChip);        
     var index = length - 1;            

     // Update model validation           
     this.ngModelCtrl.$setDirty();          
     this.validateModel();            

     // If they provide the md-on-add attribute, notify them of the chip addition 
     if (this.useOnAdd && this.onAdd) {         
      this.onAdd({ '$chip': newChip, '$index': index });     
     }                 
     };                  
    }                  
}; 
関連する問題