Hello everyone, i need some help about showing loading spinner or loading message while i am doing my large insert operation. I have 4453 items in array to insert and with the method below it takes 30 seconds on emulator. If i show loading spinner with duration ( e.g 30 seconds ) , database insertion moves extreme slowly. I have to prevent user take some action while insertion goes on at background. Is there any way for this?
insertZCaee(parameter) {
this.db.abortallPendingTransactions();
this.db.executeSql("DELETE FROM ZCAEE", {})
.then(() => { console.log("Deletion has been done in ZCAEE") })
.catch(e => { console.log(e); });
this.db.executeSql("BEGIN TRANSACTION", {})
.then(() => console.log("successfull begin transaction"))
.catch(e => console.log(e));
parameter.forEach((entry: any) => {
var params = [entry.catc, entry.inve, entry.flio];
this.db.executeSql("INSERT INTO ZCAEE ( CATC, INVE, FLIO ) VALUES (?,?,?)", params)
.then(() => { console.log("Insertion in ZCAEE"); })
.catch(e => { console.log(e); })
})
this.db.executeSql("COMMIT", {})
.then(() => console.log("Commit"))
.catch(e => console.log(e));
}
I also really need any advice on my insertion method.
You can start showing an ionicLoader before the function abortallPendingTransactions and dismiss the same loader on response as well as error of commit operation. In your code:
insertZCaee(parameter) {
//Show ionic loader with message
this.db.abortallPendingTransactions();
this.db.executeSql("DELETE FROM ZCAEE", {})
.then(() => { console.log("Deletion has been done in ZCAEE") })
.catch(e => { console.log(e); });
this.db.executeSql("BEGIN TRANSACTION", {})
.then(() => console.log("successfull begin transaction"))
.catch(e => console.log(e));
parameter.forEach((entry: any) => {
var params = [entry.catc, entry.inve, entry.flio];
this.db.executeSql("INSERT INTO ZCAEE ( CATC, INVE, FLIO ) VALUES (?,?,?)", params)
.then(() => { console.log("Insertion in ZCAEE"); })
.catch(e => { console.log(e); })
})
this.db.executeSql("COMMIT", {})
.then(() => console.log("Commit")
//Hide ionic loader
.catch(e => console.log(e)
//Hide ionic loader
}
Please try this and let me know your observations.
Thanks,
Santi Mendon
Hello, firstly your code works well with that . Thank you so much Sir. On the other hand, i have done some changes in my code. I will be so happy if you help me. I am open for any better advice about how can i achieve my goal. This process has to be done when app starts.
I have 4-5 urLs to send request with http.get method and save each of them into sq lite table which they belong to.
Here is how i retrieve the data from urls.
Promise.all([RequestObject.LoadDataFromUrl("someurl1"),
RequestObject.LoadDataFromUrl("someurl2"),
RequestObject.LoadDataFromUrl("someurl3"),
RequestObject.LoadDataFromUrl("someurl4")
]).then((result) => {
this.loader.dismiss().then(() => {
console.log("hide");
})
Promise.all([DbProviderObject.insertTable1(result[0]),
DbProviderObject.insertTable2(result[1]),
DbProviderObject.insertTable3(result[2]),
DbProviderObject.insertTable4(result[3])]).
then((res) => {
console.log(res);
}).
catch((err) => {
console.log(err);
})
}).catch((error) => {
console.log(error);
})
And here is the a type of database insertTable function
insertFastTable3(parameter) {
this.db.abortallPendingTransactions();
this.db.executeSql("BEGIN TRANSACTION", {})
.then(() => console.log("successfull begin transaction"))
.catch(e => console.log(e));
this.db.executeSql("DELETE FROM USERS", {})
.then(() => { console.log("Deletion has been done in USERS") })
.catch(e => { console.log(e); });
parameter.forEach((entry: any) => {
var params = [entry.de, entry.me, entry.me8, entry.me10];
this.db.executeSql("INSERT INTO USERS (DE,ME,ME8,ME10) VALUES (?,?,?,?)", params)
.then(() => console.log("Insertion into User fine"))
.catch(e => console.log(e));
})
this.db.executeSql("COMMIT", {})
.then(() => console.log("Commit"))
.catch(e => console.log(e));
}
The method you offered does not work in this way because of multiple insert functions(i think so) but actually it should have worked properly. I think my method above is not an efficient and proper one to achieve my goal
Your method is a bit messy. Basicaly put all the insert promises in an array and wait for them all to finish.
insertZCaee(parameter): Promise<any> {
return new Promise<any>((resolve, reject)=>{
this.db.abortallPendingTransactions();
this.db.executeSql("DELETE FROM ZCAEE", {})
.then(() => { console.log("Deletion has been done in ZCAEE") })
.catch(e => {
console.log(e);
});
this.db.executeSql("BEGIN TRANSACTION", {})
.then(() => {
console.log("successfull begin transaction");
let insertPromises = Array<Promise<any>>();
parameter.forEach((entry: any) => {
var params = [entry.catc, entry.inve, entry.flio];
insertPromises.push(this.db.executeSql("INSERT INTO ZCAEE ( CATC, INVE, FLIO ) VALUES (?,?,?)", params));
});
// Wait for all insertions to finish
Promise.all(insertPromises)
.then(()=> {
console.log("Insert succesful.");
resolve();
})
.catch((e)=>{
console.log("error during insert.")
reject(e);
})
this.db.executeSql("COMMIT", {})
.then(() => console.log("Commit"))
.catch(e => reject(e));
})
.catch(e => { reject(e) });
});
}
// in your main code, call the method and wait for it to finish.
loader.present();
this.insertZCaee().then(()=>{
console.log("Insert done");
loader.dismiss();
})
.catch( (e) => {
loader.dismiss();
console.error(e);
});
Thank you for your reply so much !