Javascript 获取typescript中的输入值

我有2个输入值，我需要对第一个

input

值（即信用卡号输入）进行验证，在ts文件上获取

input

值并在API上检查验证，而用户仍然在第二个

input

，我的第一个输入值示例：

4444

，因此我需要使用

subString（）

要在进行验证之前获得前6个数字， 这就是我曾经尝试过的

html文件

  <div>
    <input
      (keypress)="numberOnly($event)"
      class="input"
      type="text"
      (keyup)="onKey($event)"
      [(ngModel)]="creditCardNo"
    />
  </div>
  <div>
    <input
      class="input"
      type="text"
      [(ngModel)]="cardHolderName"
    />
  </div>

  onKey(event) {
    this.creditCardNo = event.target.value;
    const test = this.creditCardNo
      .replace(/\s/g, '')
      .toString()
      .substr(0, 6);
      this.paymentService.getCreditCardDetail('JPJSMN', test).subscribe(res => {
        if (!res) {
          return;
        }
        console.log(res);
      });
  }

---

使用

（keyup）=“onKey（$event）”

获取值更改，并根据得到的响应对ts文件进行验证，但是我注意到，如果我使用

（keyup）=“onKey（$event）”

，它不会检测复制和粘贴，并且会不断请求API，是否有更好的实践来解决这个问题

您可以选择创建自定义的“仅数字化”角度指令

有关如何执行此操作的详细指南，请参见：

---

教程中显示的指令解决了复制和粘贴等问题。

如果您只想在用户通过与编辑值相同的方式传递内容时更新模型，则可以使用

(ngModelChange)="pasteEvent($event)"

<div>
    <input
      (keypress)="numberOnly($event)"
      class="input"
      type="text"
      (ngModelChange)="pasteEventcreditCardNo(creditCardNo)"
      [(ngModel)]="creditCardNo"
    />
  </div>
  <div>
    <input
      class="input"
      type="text"
      (ngModelChange)="pasteEventcardHolderName(cardHolderName)"
      [(ngModel)]="cardHolderName"
    />
  </div>

（ngModelChange）=“粘贴事件（$event）”

是否有任何链接可以让我阅读更多关于此的信息？它将如何在ts文件中？我正在更新答案，请检查。