未捕获的 ReferenceError onKeyPress

Question

我想看看用户输入的是字母还是数字。它在我使用 @HostListener 时有效，但在 HTML.

中使用 onKeyPress 时无效

这是我的HTML

<div class="table">
 <div class="cell" *ngFor="let number of [_,1,2,3,4,5,6,7,8,9,10]">
  <input class="number" value="{{number}}" disabled>
 </div>
 <div class="row" *ngFor="let row of grid?.boxArray; let i = index">
  <input class="number" value="{{i+1}}" disabled>
   <div class="cell" *ngFor="let col of grid?.boxArray; let j = index">
    <input type="text" onKeyPress="detectLetter('$event')" id="{{i}}_{{j}}" class="box" maxLength="1"
           [ngClass]="{ 'sel': grid.boxArray[i][j].isSelectedHint, 'unsel': !grid.boxArray[i][j].isSelectedHint, 'black': grid.boxArray[i][j].isBlack }" >
   </div>
 </div>
</div>

这里是函数 detectLetter()

public detectLetter(event: KeyboardEvent, x: number, y: number): void {
   const key: number = event.keyCode;
   if ( key < 65 || key > 122) {
     alert("It's not a letter");
   }
}

Answer 1

之所以会出现此错误，是因为 angular 有自己的方法，例如 (keypress)，因此您只需对代码进行少量更改：

<div class="table">
 <div class="cell" *ngFor="let number of [_,1,2,3,4,5,6,7,8,9,10]">
  <input class="number" value="{{number}}" disabled>
 </div>
 <div class="row" *ngFor="let row of grid?.boxArray; let i = index">
  <input class="number" value="{{i+1}}" disabled>
   <div class="cell" *ngFor="let col of grid?.boxArray; let j = index">
    <input type="text" (keypress)="detectLetter($event)" id="{{i}}_{{j}}" class="box" maxLength="1"
           [ngClass]="{ 'sel': grid.boxArray[i][j].isSelectedHint, 'unsel': !grid.boxArray[i][j].isSelectedHint, 'black': grid.boxArray[i][j].isBlack }" >
   </div>
 </div>
</div>

我认为你的情况更好的方法是使用 (keyup)

未捕获的 ReferenceError onKeyPress

Uncaught ReferenceError onKeyPress

html

onkeypress

typescript

angular