Question

我不想让用户在第一个字符中输入空格，并且还要限制用户使用3个特殊字符。

他应该能够在第一个单词之后按空格键。我使用了REGEX with directive，我能够实现其中的大部分功能。问题是用户无法在输入框中的任何位置输入空格。

帮助正则表达式将不胜感激。我也附了一个plunker链接。 https://plnkr.co/edit/05fqqyAn7LRr9vOtri4b?p=preview

＆＃13;

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

app.directive("regExInput", function(){
    "use strict";
    return {
        restrict: "A",
        require: "?regEx",
        scope: {},
        replace: false,
        link: function(scope, element, attrs, ctrl){
          element.bind('keypress', function (event) {
            var regex = new RegExp(attrs.regEx);
            var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
            if (!regex.test(key)) {
               event.preventDefault();
               return false;
            }
          });
        }
    };
});

＆＃13;

<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.14/angular.js" data-semver="1.3.14"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>INSane {{name}}!</p>
    
    <div>
      <input type="text" reg-ex-input reg-ex="^[^-\s&</][ws-]*$" />
    </div>
  </body>

</html>

＆＃13;

Answer 1

这是你的正则表达式的意思，一件一件

^         Beginning of string
[^        Any character that's not one of the following:
  -         Literal '-' character
  \s        Whitespace
  &         Literal '&' character
  <         Literal '<' character
  /         Literal '/' character
]
[         One of the following characters:
  w         Literal 'w'
  s         Literal 's'
  -         Literal '-'
]
*         ...repeated 0 or more times
$         End of string

如果您的意图是在第一个字符之后是字符，空格或字符＆＃34; - ＆＃34; ，[ws-]应该替换为{ {1}} [\w\s-]表示＆＃34;字符＆＃34; \w表示空格，而不是\s和w这些字面字符。

Answer 2

第二个问题是指令本身。该指令将单字符输入与为整个字符串设计的正则表达式进行比较：

if (!regex.test(key)) {
  event.preventDefault();
  return false;
}

如果您想测试整个字符串的有效性，那么在keypress事件中这样做是行不通的。按键事件告诉您按下了什么键，而不是如果接受按键，结果字符串将。通常，您需要在值发生更改后针对正则表达式验证整个字符串，例如在input事件中。这意味着您将无法取消按键，但无论如何这将是一个不寻常的用户体验。例如，退格键和箭头键是按键，并且在正则表达式的上下文中对它们进行评估并没有多大意义。您可能需要考虑验证 UX，而不是按键预防。

Angular / Regex中输入框中的空格问题？我需要限制第一个空格，然后允许用户在第一个字符

2 个答案: