Angular 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);
          }

      }
    }
}])