Ionic not updating view

Ionic Framework ionic-v3
1

Hi I got a function which will update after a http request to the server. It seems that the console.log show that the value has been updated but the UI is not updating unless I click on any other component(ex. input).

This is my function:

fileTransfer.upload(this.created_image, upload_url, options)
.then((data) => {
    console.log("success:"+data.response); //This is showing correct response
    var obj = JSON.parse(data.response);
    this.sv_value = obj.value;
    console.log(this.value); //This is showing correct value
}, (err) => {
    console.log("failure:");
})

This is my view html:

  <ion-row>
      <ion-col center width-100 no-padding>
        <h2>{{sv_value}}</h2> //This is not updated
      </ion-col>
  </ion-row>

Is there any way I can tackle this issue? Thank you

2

Can you please post the entire file, not just this bit?

3

I think you are using cordova fileTransfer directly instead of ionic’s native file transfer wrapper. A simple solution is to switch to ionic’s native wrapper for fileTransfer. The key issue is that fileTransfer does not “align” with the concept of angular zones so the DOM bindings doesn’t get updated (see Progress binding is not updating while uploading). If you use ionic native wrapper, this would work automatically instead of you having to stuff in zone.run()