can not call apis multiple time from the front-end

Q&A
1

Hello i am new to bonitasoft started working with company that uses this product.

i have to filter through data that requires to make multiple api calls so i wrote it in front-end (i do not know if using groovy script was better but i do not know) the way i do it is i make api calls with fetch in a loop.

the problem is that the response is delayed obviously and the application loads faster. 

is there any way to fix this, i looked through the documentation but i could not find anything useful.

P.S i am using bonitasoft 7.8.4

2

Hello, could you give more information about your use case?
I'm trying to understand what you mean by trying to filter through the data and why that would require you to make multiple API calls.

3

I have an array and deppending of states of elements i have to get data from bpm api and depending on this data i have to assign state for it

4

Ok, ignore the other response, the admins should delete it shortly

5

So, the way that I see how to do this is:

Let's say you have a JSON variable elementStates that has the value [].

You can now add a string variable that will contain the API call to make. Put it's value to "undefined", so that there is no API call that is made when the page starts.

Now, you can add a variable "ctrl" that will check for changes in the elementStates variable:

It's value will be something like this:

// some condition to check, here I'm checking if elementStates contains "getProfileList"
if ($data.elementStates.includes("getProfileList")) {
    // remove the item from the array so that it gets executed only once
    const index = $data.elementStates.indexOf("getProfileList");
    $data.elementStates.splice(index, 1);

    $data.apiCallToMake = "../API/portal/profile?c=10&p=0";
}

Afterwards, what remains to be done is to use the string variable (the apiCallToMake variable) in an external API variable.
So, the value will be something like this: "{{apiCallToMake}}".
Now, every time you will have "getProfileList" that will be added to the elementStates variable, you will have an API call that will be made to get the list of profiles.

For the second part, where you want to check the data, you can add another if to the "ctrl" variable to check the API call response.

Hope this helps.

6

Well i have already done logic and everything but the problem is that it returns promises and the page loads before promises can be resolved i tried to render the page after they were resolved with $q.all and then but still did not work 

7

I'm having a small problem understanding why you would want to render the page after all the promises have been resolved. Usually, if I understand promises well, you treat the response of the promises when they come using ".then()" for a single promise or "Promise.all().then()" for multiple promises. I would let the page render before and then treat the promises as they come.
If you need to not show anything while the page is loading the data, I would show a loader while the page is not loaded completely (by using a variable).

8

yes that is exactly what i am tring to do and the results that are not promises show up perfectly fine but the promises does not update even when it resolves also i tried to not render html untill promises resolves but that does not change anything 

9

Hello again. So, I looked at it and there are two ways that I see how to do it.
The first way is a dirty way (that I don't recommend, but it gets the job done fast):
You can create a javascript file asset and import it into the UID with the following code

function applyScope() {
    angular.element(document.getElementsByTagName('body')[0]).scope().$apply();
}

This will trigger the angularjs calculations when you will call the function. It is fine, but again, I don't recommend it because it's dirty since it's going around the calculations of angular. You can find more about why it's a bad idea to use scope.apply on the internet.

Now, for the second option that I do recommend (but which requires a bit more work). Rest API extensions. This will let you create a custom Rest API, which you will be able to call in the UID page pretty easily.

10

Thank you for the answer and yes i am currently working on custom rest api!