How to stop method execution in $scope.$on until upload ends

Question

I'm trying to upload a batch of files on form save click. The method should wait until the file uploading ends and then do the saving. Right now the method doesn't wait and saves before the files are uploaded.

Here is my code

$scope.$on("formSubmitting", function (ev, args) {
        $scope.uploadPendingFiles();
    });

uploadPendingFiles(); is doing XMLHttpRequest send.

Any idea how to do it?

EDIT

as suggested, more info:

On the form i can pick some files to upload but the uploading should only start when user clicks the save button. The parent controller broadcasts formSubmitting on save click and i want to display loading gif until all the files are uploaded.

Answer 1

Cause your task is based on legacy code, the solution can be using preventDefault() method for click event of submit button.

So i've prepared sample, describing your case (please, say if there is misunderstanding in it).

About event propagation in a few words you can read in this article.

Hope this helps!