时间戳

首页 > 解决方案 > 自动接收 OTP 并验证 OTP，UI 未更新

android - 自动接收 OTP 并验证 OTP，UI 未更新

问题描述

我正在尝试为我的 Ionic 4 App for Android实施自动otp验证。我在下面的代码中尝试过，我能够接收到消息，但 UI Input Filed 没有更新收到的OTP

app.component.ts

      constructor(public alertCtrl: AlertController,
    public platform:Platform,
    public androidPermissions: AndroidPermissions,
    public http:Http,
  public navCtrl:NavController,
  public navParams: NavParams) {
    document.addEventListener('onSMSArrive', function(e){
      var sms = e.data;

     console.log("received sms "+JSON.stringify( sms ) );

     if(sms.address=='HP-611773') //look for your message address
     {
       this.otp=sms.body.substr(0,4);

      this.verify_otp();
     }
    });

      }


 verifyOTP()
    {
      console.log("verify otp");

    }

我可以通过OTP看到警报，但我的下方 UI 未更新。

app.component.html

<ion-header>
  <ion-toolbar>
    <ion-button size="small" (click)="goBackToFirstTimeLogin()">Back</ion-button>
    <ion-title>verifyOTP</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content padding>
  <ion-item>
    <ion-label floating>Enter OTP</ion-label>
    <ion-input type="text" [(ngModel)]="otp"></ion-input>
  </ion-item>
  <button ion-button (click)="verifyOTP()">Verify</button>
  <ion-button size="small" (click)="setPassword()">SetUp Password</ion-button>
</ion-content>

`

[(ngModel)]="otp"值没有更新。

我得到以下错误：

像这样出错

我遵循以下 GitHub 链接：

https://github.com/bharathirajatut/ionic3/tree/master/SMSOTPVerificationAutomate

你能帮我一个人吗，在此先感谢！！！！

标签： androidionic-frameworkionic4

解决方案

把它放在 ionViewCanEnter() 中，这样每次视图加载时它都会更新

推荐阅读