C
I just realized that you're using Angular, and I don't send anything from Angular or the expression language you're using to load the data, but I'll try to help you by giving an example with JSVanilla and you try to adapt to your reality, let's go. First you need to know why this error happens, unlike other programming languages that are multi-thread() and have by default synchronous processing (como JAVA por exemplo), the JS is the opposite, it is single-thread and the processing happens asynchronously, so you will often end up falling into errors like this because it does not expect the processing of a method to end up to run another, formerly used linked callbacks to solve this problem, but this was seen as bad practice by the community, so arose the Promises, they are basically a structure that allows you to run a block of code only when another finish processing, only more concisely facilitating maintenance. Let's take as an example the following code:let teste = 0;
function exibirValorTeste () {
console.log(teste);
}
setTimeout (() => {
teste = 1;
}, 3000);
exibirValorTeste();
in this code the value displayed on the console would be 0 because the value of the test variable only changes to 1 after 3 seconds, only the method exibirValorTeste() is called before that, now we will see the same method using Promiseslet teste = 0;
function exibirValorTeste () {
console.log(teste);
}
new Promise(function(resolve, reject) {
setTimeout (() => {
teste = 1;
resolve();
}, 3000)
}).then (
(value) => {
exibirValorTeste();
},
(error) => {
//pode exibir um alerta de erro por exemplo
}
);
already in this example it would display 1 in the console because the method exibirValorTeste() is only called when the block of setTimeout() is finished, and at this time the test variable would already be with value 1, to understand the operation of Promise we will divide it into two parts:new Promise(function(resolve, reject) {
setTimeout (() => {
teste = 1;
resolve();
}, 3000)
})
At this moment you are instantiating the Promisse, it receives as parameter a função anonima in its constructor, which in turn receives 2 parameters, the resolve serves to signal success and reject to signal error in your Promise, inside the block Promise we have setTimeout() which defines that after 3 seconds the test variable = 1, realize that then we call the resolve() that signals the Promise that everything went well and that now she can run the block then()..then (
(value) => {
exibirValorTeste();
},
(error) => {
//pode exibir um alerta de erro por exemplo
}
);
The block then() receives two anonymous functions as parameter the first is executed when you call the resolve() and must contain the successful actions, and the second is called when you call the reject() and must contain the error actions, Obs: AS DUAS NUNCA SERÃO EXECUTADAS AO MESMO TEMPO, in our example there is only success then we will always fall into the first function, and within the block of success we call the function exibirValorTeste()Some final considerations:1° - The second parameter of the method then() is optional, if we wanted to, we could write then() only with the successful parameter. 2° - You can pass values as parameter the functions of success and error, when calling the resolve or reject as for example reject(algumValor) or resolve(algumValor), and to use these values is only to use the parameters received in each respective function, as our test variable was global that was not necessary in our example, so I called it resolve() as empty relatives.I recommend that you deepen your studies in Promises because this is a key topic for any JS developer.So what you'll have to do in your code is to get your data to be uploaded into one Promise, and your verification method is inside the block then() that Promise, maybe you have to stop using the Expression Languages and upload the data through a request AJAX, setting the values via JS manually, that part there you will have to hit head to refactor your code. Good luck, I hope my explanation helped you.
