Question

我想限制用户在开头给出一个负号，因为当给出错误的数据时，它会被存储在数据库中并且前端受到干扰。我试过了

if(e .key Code == 109)
{
return ;
}

Answer 1

您可以使用数字输入，如下所示：

<input type="number" min="0"></input>

这将阻止数字低于0。

如果您绝对需要文本输入，最好的方法是使用正则表达式或字符串函数进行验证，并提供带有适当CSS的错误消息，告诉用户他无权使用否定值标志。向用户提供反馈比阻止他们完全做某事要好得多，因为它可能会使他们感到困惑。

如评论中所述，您应始终在后端/服务器端进行验证。这是您保护数据库免受错误数据的地方。总是假设用户会试图打破你的工作并找到尽可能多的自由，同时保持对所有行为的控制。

编辑：我误解了你的问题。如果要阻止用户在前面以外的位置写入负号，请使用数字输入（不使用最小值）或进行简单验证。您也可以使用Angular的FormsModule，它包含一些验证器，包括正则表达式验证，或允许自定义验证器。

Answer 2

您可以创建onlyNumber自定义指令并添加条件以允许在数字的索引0处为负数（e.keyCode 109,189）。

仅-number.directive.ts：

import { Directive, ElementRef, HostListener, Input } from '@angular/core';

@Directive({
  selector: '[onlyNumber]'
})
export class OnlyNumber {

  constructor(private el: ElementRef) { }

  @Input() onlyNumber: boolean;
  @Input() inputValue: number;

  @HostListener('keydown', ['$event']) onKeyDown(event) {
    let e = <KeyboardEvent> event;
    if (this.onlyNumber) {
      // console.log(this.inputValue);
      // console.log(e);
      if((this.inputValue == undefined ||this.inputValue.length == 0) 
          && (e.keyCode == 189 || e.keyCode == 109)){
          return;
      }
      if ([46, 8, 9, 27, 13, 110, 190].indexOf(e.keyCode) !== -1 ||
        // Allow: Ctrl+A
        (e.keyCode == 65 && e.ctrlKey === true) ||
        // Allow: Ctrl+C
        (e.keyCode == 67 && e.ctrlKey === true) ||
        // Allow: Ctrl+X
        (e.keyCode == 88 && e.ctrlKey === true) ||
        // Allow: home, end, left, right
        (e.keyCode >= 35 && e.keyCode <= 39)) {
          // let it happen, don't do anything
          return;
        }
        // Ensure that it is a number and stop the keypress
        if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
            e.preventDefault();
        }
      }
  }
}

HTML：

<md-input-container>
  <input mdInput placeholder="Value" 
         [(ngModel)]="inputVal"
         [inputValue]="inputVal"
         onlyNumber="true" >
</md-input-container>

demo

试图限制用户输入字符串的零位置

2 个答案: