ngx-otp-input 中的自动对焦在 ionic 5 中不起作用

Question

我尝试使用 ionic 5 进行 ngx-otp-input ，就像示例中的那样 https://www.npmjs.com/package/ngx-otp-input#otpchange ，但是 autofocus 对我不起作用。 有什么想法吗？

Answer 1

Add in HTML

<ngx-otp-input [config]="otpInputConfig" (otpChange)="handeOtpChange($event)" (fill)="handleFillEvent($event)">
    </ngx-otp-input>

Add in TS File

otpInputConfig: NgxOtpInputConfig = {
    otpLength: 6,
    autofocus: true,
    classList: {
      inputBox: "my-super-box-class",
      input: "my-super-class",
      inputFilled: "my-super-filled-class",
      inputDisabled: "my-super-disable-class",
      inputSuccess: "my-super-success-class",
      inputError: "my-super-error-class"
    }
  };

  handeOtpChange(value: string[]): void {
    console.log(value);
  }

  handleFillEvent(value: string): void {
    console.log(value);
  }

Answer 2

这将解决问题

 ionViewDidEnter() {
    setTimeout(() => {
        (document.getElementsByClassName('otp-input')[0] as HTMLInputElement).focus();
    }, 500);
  }