Just a part of some images are shown when downloading many images


In my app, there are quite a few images on the home page.
Once it starts, it shows some default images first, and then load the local images (if exist) or tries to fetch/update the images from the server.
In the template, it is something like this

<img ng-src="{{images.localPath || imgs/default.png}}">

When there is no local image (localPath is undefined),
the app fetches the image with two steps:

  1. download the image using ngcordova/filetransfer
  2. when downloading is finished, resolve the path of the image and binds to images.localPath

We find when downloading many images, some of them would partially shown.
And if we resolve the path with a 3s delay in step 2, the situation does not happen (at least as many times as we have tried) .