I use Ionic 5 and angular .My page bind to an object((Person)).when I select data from websql my object is update but page is not update until I click menu or other control

//this code is in my component in the click button
//jsonData initial

jsonData["SelectFunctionInSuccess"] = (result)=>{
      this.Person.Id = result[0].Id;
      this.Person.Code = result[0].Code;
      this.Person.Name = result[0].Name;
      this.Person.Family = result[0].Family;
      
}
    
this.crudManager.SelectData(jsonData);//<= this is call websql

//**************************************************
//in the websql class
// QueryStatement is declare and set correct it is string variable

this.db.readTransaction(function (tx) {


            tx.executeSql(QueryStatement, [], function (tr, results) {
                jsonData.SelectFunctionInSuccess(results.rows);
            });

        }, this.getError);

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Select run and I get data. Person is update but html is not update

CodePudding user response：

I had a similar problem some time ago. You make an external call and Ionic behaves a bit differently to update the page at that moment. You need to refresh your page, this can be done with the following code:

    constructor(public appRef: ApplicationRef) {}

and when you want to refresh :

this.appRef.tick();