angular - PrimeNG:手动输入时未触发 p-inputNumber onInput

Question

我使用的是 PrimeNG 版本 10.0.2
使用组件 p-inputNumber , onInput手动修改值时不会触发事件。当我使用微调按钮时，它正常工作。
HTML:

<p-inputNumber
    [(ngModel)]="currentPage"
    [showButtons]="true"
    buttonLayout="horizontal"
    spinnerMode="horizontal"
    [step]="1"
    size="2"
    incrementButtonIcon="pi pi-angle-right"
    decrementButtonIcon="pi pi-angle-left"
    [min]="1"
    [max]="maxPages"
    (onInput)="changePage()"
  >
  </p-inputNumber>

组件代码:

export class MyComponent {
  
  currentPage = 1;
  maxPages = 100;
  ...
  changePage() {
    console.log(this.currentPage);
  }
}

Answer 1

更新 changePage从 $event 中获取值，然后您将获得您输入的当前值

<p-inputNumber
    [(ngModel)]="currentPage"
     ...
    (onInput)="changePage($event.value)"
  >
  </p-inputNumber>

  changePage(val) {
    console.log(val);
  }

demo 🚀
另一种选择是使用 ngModelChange 事件

<p-inputNumber
    [(ngModel)]="currentPage"
     ...
    (ngModelChange)="changePage()"
  >
  </p-inputNumber>

the only different is the ngModelChange will fire on blur when youchange the value manually but it will work normally when you click onthe buttons

demo 👨‍🚀