Auto detect otp can not be prefill text box

Auto detect otp can not be prefill text box . i use this below code;

constructor(){
      document.addEventListener('onSMSArrive', (e)=>{
        var sms = e.data;
        
       console.log("received sms "+JSON.stringify( sms ) );
       
       if(sms.address=='HP-xxxxxx') //look for your message address
       {
         let smsotpcode=sms.body.substr(0,6);
         this.otpcode =smsotpcode;
         alert(this.otpcode)
        this.stopSMS();
        this.otpAction(this.otpcode);
       }
        
        
      });
  this.checkPermission();
  }


  checkPermission()
  {
    this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.READ_SMS).then(
      success => {
        
        //if permission granted
        this.receiveSMS();
      },
    err =>{
      
      this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.READ_SMS).
      then(success=>{
        this.receiveSMS();
      },
    err=>{
      console.log("cancelled")
    });
    });
    
    this.androidPermissions.requestPermissions([this.androidPermissions.PERMISSION.READ_SMS]);
    
}
receiveSMS()
    {
      
      if(SMS) SMS.startWatch(function(){
        console.log('watching started');
      }, function(){
        console.log('failed to start watching');
      });
    }
    stopSMS()
    {
      if(SMS) SMS.stopWatch(function(){
        console.log('watching stopped');
      }, function(){
        console.log('failed to stop watching');
      });
}

.html code

<ion-item no-padding>
   <i class="fa fa-user-o" aria-hidden="true"></i>
  <input type="number" [(ngModel)]="otpcode" placeholder="Enter Your Verification Code" >
 </ion-item>

Please help me out what am doing wrong.
Thanks in advance