Animate delay after data is fetched [Mobile]

Animate delay after data is fetched [Mobile]

  

Hi,

The animate pattern has the delay attribute, but I wanted to use it right after a data is fetched or an action flow is complete. Is there any way to do it?

Thank you.

Solution

Hey Nicolas,

Just set the delay to 0, and enclose the animate block on an if statement with Aggregate.IsDatafetched or DataAction.IsDataFetched.

It should do the trick

Cheers

Solution

Hey.

Unfortunately I have already tried this, but I get always the same notification error in the app "Cannot read property 'querySelector' of null".

I am not using any javascript inside this screen. My screen has those component in the following order:

  1. If (IsSubmissionFetched)
  2. Animate
  3. Carousel
  4. List Group
  5. Calendars

In the After Fetch action I added an assign at the end of the flow changing the value 'IsSubmissionFetched' to True. However the error keep persist.


Hey,

The Data Actions and aggregates properties isDataFetched are automatically filled in, no need for the assign property. See below image:

Can you take a print of your tree view so I can understand better what's going on?

Since it's a javascript error it seems to be related with the carousel, but it's hard to tell.

Alternatively, can you build a sample .oml replicating the issue and share here?

Cheers

Hey,

The truth is I have a screen aggregate (A) and after is fetched (action) I call another aggregate (B) that depends on the aggregate screen (A). I need the data coming from the aggregate B to fullfill my screen. 

I removed the if, but it would be above the animate. Without the if everything works fine.

From your description, I think you should enclose the Animate on an if with the condition set tothe Aggregate (B).isDataFetched. And aggregate (B) should run onAfterFetch of the aggregate (A).

Could that work?

PS: Perhaps you'll want to add something on the false of the if condidition, so the user don't get a blank screen until the data of the aggregate(B) is fetched.

Let me know if it works

May I suggest that you create a Data Action (Fetch Data From Other Sources option) where you execute the 2 aggregates? That way you may define a data unique data source, minimizing the device-server roundtrips. IsDataFetched property is also available in this case.


Henrique Batista wrote:

From your description, I think you should enclose the Animate on an if with the condition set tothe Aggregate (B).isDataFetched. And aggregate (B) should run onAfterFetch of the aggregate (A).

Could that work?

PS: Perhaps you'll want to add something on the false of the if condidition, so the user don't get a blank screen until the data of the aggregate(B) is fetched.

Let me know if it works


Not really, because the Aggregate (B).isDataFetched is not available in the If condition (screen), to be inside an action.

Tiago, I forgot to mention that my aggregates are local. No server's call.

Without your code is difficult to do a deeper analysis.

An approach worth trying is to encapsulate part of the UI in a web block that receives the value of AggA and executes AggB inside.

Hey,

Ok I think the henrique solution did the trick. The query selector must not be related to the animation but yes with something else (Calendar probably), so I marked the solution.

Thank you everyone for your help!