Unable to bind a value from document.addEventListener

Ionic Framework ionic-v3
1

hello guys,
i have implemented auto read sms on smsArrived
but unable to bind this OTP in ngmodel
here is my code

watchNewSMS() {
    this.platform.ready().then((readySource) => {
      if (SMS) SMS.startWatch(() => {
        console.log('watching started');
      }, Error => {
        console.log('failed to start watching');
      });
      document.addEventListener('onSMSArrive', function (e: any) {
        if (e.data.address == 'test') {
          console.log(JSON.stringify(e.data))
          let sms = e.data.body
          let otp = sms.split('Your password reset code is ')[1].split('.')[0]
            this.model_autoCapturedOtp = sms.split('Your password reset code is ')[1].split('.')[0]
            console.log(this.model_autoCapturedOtp)    // <--successfull
        }
      });

    });
  }

in html

<ion-item *ngIf="!autoOTPCaptured">
  <ion-input [(ngModel)]="model_autoCapturedOtp" placeholder='Recovery Code'>
</ion-input>

but in html page value not showing

please help

thanks

2

Did you change autoOTPCaptured value since you have *ngIf="!autoOTPCaptured"?

3

Yes i did, I hv removed that condition
But still hving that issue. May b problem is inside document.addEventListener which not allowing me to assign otp in model_autoCapturedOtp

4

How about using arrow functions?

Does changing document.addEventListener('onSMSArrive', function (e: any) { to

document.addEventListener('onSMSArrive', (e: any) => { work for you?

5

thanks Vivek you made my day.
this skipped from my mind
thank you so much

1 Like
6

@dipankar123 Glad to help :slight_smile: