Javascript Angular2输入类型编号，无十进制值

我一直在想，防止angular2在数字输入中输入小数的正确方法是什么

是否有我可以添加的特定事件或约束？ 例如，当我只使用pattern或类似的方法时，它只会使字段无效，但仍然允许键入

防止这种情况发生的正确方法是什么，只需使用旧键盘、按键事件和检查击键

因为根据评论，要求模式或w/e是错误的，下面是我现在实现的东西，工作起来很有魅力

<input (keypress)="preventInput($event)" type="number" step="1">

---

然而，这不会阻止输入。通过粘贴，但对我们来说已经足够好了。

我通常看到它是通过自定义指令完成的。这比vanilla JS更可取，因为如果您现在或将来想将其他角度逻辑绑定到事件中，您可以使用scope对象监听关键事件

angular.directive('preventSomeKeystrokes', function () {
    link(scope, elem, attrs) {
       elem.on('keydown', function (event) {
          event.preventDefault();    
          event = event || window.event;
          // maybe prevent certain keys dynamically with $scope?
          // or see how often your users are typing in '.'s with angular.$log().
          var key = _event.keyCode || _event.which;
          key = String.fromCharCode(key);
          var strToTest = '.';
          if (/* some regex with '.' */.test(key)) {
              return false;
          }
      }
});

---

在Angular2中，这与angular1非常相似。需要注意的是，最好保持逻辑在angular内运行，因为如果需要，或者如果该类中的逻辑需要增长，可以基于当前事件触发/响应其他angular事件

语法不同，但创建侦听击键的指令的逻辑基本相同

@Directive({
   selector: 'prevent-input',
   template: `<input type="text" (keypress)="preventKeyStrokes($event)">`
})

export class PreventInput {
   constructor() {}
   preventKeyStrokes(event) {
          event.preventDefault();    
          event = event || window.event;
          var key = event.keyCode || event.which;
          key = String.fromCharCode(key);
          var strToTest = '.';
          if (/* some regex with '.' */.test(key)) {
              return false;
          }
    } 
}

@指令({
选择器：“阻止输入”，
模板：``
})
导出类输入{
构造函数（）{}
防止击键（事件）{
event.preventDefault（）；
event=event | | window.event；
var key=event.keyCode | | event.which；
key=String.fromCharCode（key）；
var-strottest='；
if（/*某些带有“.”*/.test（键）的正则表达式）{
返回false；
}
} 
}

---

$event

是一个DOM键盘事件。如果我能提供更多帮助，请告诉我。

关于

ngPattern

？正如我在我的OP中已经说过的，仍然允许输入值，我想阻止这种情况。在这种情况下，您需要向我们展示您尝试了什么，因为您没有这样做。。。“你已经试过了”并不意味着“你已经用正确的方式试过了”不，我是在问路要走，我可以很容易地插上一些东西让它为我工作。我在征求关于最佳实践的建议。没有“尝试”的好做法。要么你跟随一个，要么你不跟随，如果你不知道哪一个存在，你将永远不会。据我所知，你并不总是需要有一个无法解决的问题。至于现在，我将执行（keyUp）并检查事件键。谢谢你的尝试。这看起来像是angular（1.x），我问angular2:-），但我想我可以使用那种绑定。你没有指定这是angular2问题。我会准备一个答案：-谢谢你在打字脚本中添加它。我不实用。应该使用

@HostListener

完成，而不使用模板。

@Directive({
   selector: 'prevent-input',
   template: `<input type="text" (keypress)="preventKeyStrokes($event)">`
})

export class PreventInput {
   constructor() {}
   preventKeyStrokes(event) {
          event.preventDefault();    
          event = event || window.event;
          var key = event.keyCode || event.which;
          key = String.fromCharCode(key);
          var strToTest = '.';
          if (/* some regex with '.' */.test(key)) {
              return false;
          }
    } 
}