Question

我有以下Angular指令应该将输入大写，并拒绝任何非英文字母字符的字符：

<input type="text" maxlength="1" capitalize />


.directive('capitalize', function() {
  return {
    require: 'ngModel',
    link: function(scope, element, attrs, modelCtrl) {
      var capitalize = function(inputValue) {
        if (inputValue == undefined) inputValue = '';

        inputValue = inputValue.replace(/[^a-zA-Z]/g, ''); //to reject non-alphabet characters
        var capitalized = inputValue.toUpperCase();
        if (capitalized !== inputValue) {
          modelCtrl.$setViewValue(capitalized);
          modelCtrl.$render();
        }
        return capitalized;
      }
      modelCtrl.$parsers.push(capitalize);
      capitalize(scope[attrs.ngModel]); // capitalize initial value
    }
  };
})

它确实大写输入，但不拒绝非字母字符。建议？

Answer 1

在单独的变量中删除特殊章程后存储更新的输入值，然后将其大写，以便可以将大写的更新输入值与原始值进行比较。

 var charString = inputValue.replace(/[^a-zA-Z]/g, ''); //to reject non-alphabet characters
 var capitalized = charString.toUpperCase();

在这里更新了JSFiddle：http://jsfiddle.net/p149wuL1/3/ 我希望这有帮助

Answer 2

这是很常见的想法 - 让我们只允许输入中的一些特殊字符。（在你的情况下只有字母）它看起来很有吸引力。

不幸的是，没有简单的解决方案。似乎没有用户友好的解决方案。请记住，在文本字段中有三种主要的输入方式： 1.键盘 2.复制粘贴 3.拖放

如果能够合理地处理第一种方式，那么第二种和第三种方式呢？什么应该粘贴'123％^ $ R，A'结果你的情况？粘贴'123'应该是什么结果？什么？

在这里添加一些技巧来保持carret的位置......

总之，我建议你让文本字段为文本字段，如果字符错误则将输入标记为无效。

Angular指令用于大写字母和忽略数字

2 个答案: