角1.4.7のディレクティブがすべての数値入力にバインドされました

Question

すべての<input type="number">要素にディレクティブをバインドする方法があるかどうかを判断しようとしていますが、各要素にクラス、追加属性などを追加する必要はありません。番号フィールド？

私は数字フィールドがたくさんあるので、それらをすべて更新する必要はありません。

Answer 1

入力タイプに固有にバインドする方法がないと思われるので、すべての入力にバインドされた単純なディレクティブを作成してから、ディレクティブの機能を番号タイプの入力に分離しました。

.directive('input', ['$document', '$log', '$filter', function ($document, $log, $filter) { 
    return { 
     restrict: 'E', 
     require: '?ngModel', 
     scope: { 
     directiveConfig:  '=', 
     controllerInterface: '=' 
     }, 

     link: function (scope, element, attrs, ngModelCtrl) { 
     // -------------------------------------------------------------- 
     // Formatters & Parsers for `input[type="number"]` only 
     // -------------------------------------------------------------- 
      if (attrs.type === "number") { 
      // Prevents number inputs from using scrolling to change number. 
      element.bind('mousewheel', function (event) { 
       event.preventDefault(); 
      }); 

      // Prevents number input from changing with up/down arrow keys and 
      // instead simulates tabbing. 
      element.bind("keydown keypress", function (event) { 
       var inputs = element.closest('form').find(':input'); 

       switch (event.which) { 
       case 38: 
        // Arrow Up: 38 
        inputs.eq(inputs.index(element) - 1).focus(); 
        event.preventDefault(); 
        break; 
       case 40: 
        // Arrow Down: 40 
        inputs.eq(inputs.index(element) + 1).focus(); 
        event.preventDefault(); 
        break; 
       default: 
        break; 
       } 
      }); 

      // Ensures that only numbers can be entered. 
      var numericUserInput = function(value) { 
       var parsed = null; 

       if ($filter('exists')(value)) { 
       parsed = parseFloat(value.toString().replace(/[^0-9.]+$/, ''), 10); 

       if (typeof(value) != "number") { 
        parsed = null; 
       } 

       if (parsed !== value) { 
        ngModelCtrl.$setViewValue(parsed); 
        ngModelCtrl.$render(); 
       } 
       } 

       return parsed; 
      } 

      ngModelCtrl.$parsers.push(numericUserInput); 
      } 

     } 
    } 
}])