File reader fails in angular js sumbit button

Question

I am trying to send data & image to MVC controller from angular js controller. where i am trying to convert image to base 64 and passing to HTTP service call. Actually when i run below code with break point step by step its work fine but when i click after removing all break points. nothing happens screen keeps remains. i think code not wait for success call of reading of file as file reader. can any body suggest what is this actually problem and its solution

$scope.SubmitProduct = function (requiredData) {
        requiredData.DiscountUnitId = $scope.discountUnit
        requiredData.ProductId = requiredData.Id

        for (var i = 0; i < $scope.productCategoryList.data.length; i++) {
            if ($scope.productCategoryList.data[i].Id === $scope.productCategory) {
                requiredData.ProductCategory = $scope.productCategoryList.data[i].CategoryName;
            }
        }

        ///Image 1
        var Image1 = document.getElementById("Image1").files;
        handleFiles(Image1);
        if (Image1 && Image1[0]) {
            var FR = new FileReader();
            FR.readAsDataURL(Image1[0]);
            var imageBase1 = FR.result;
            imageBase1 = /,(.+)/.exec(imageBase1)[1];
            requiredData.Image1 = imageBase1;
        }

        ///Image 2
        var Image2 = document.getElementById("Image2").files;
        if (Image2 && Image2[0]) {
            var FR = new FileReader();
            FR.readAsDataURL(Image2[0]);
            var imageBase2 = FR.result;
            imageBase2 = /,(.+)/.exec(imageBase2)[1];
            requiredData.Image2 = imageBase2;
        }


        ///Image 3
        var Image3 = document.getElementById("Image3").files;
        if (Image3 && Image3[0]) {
            var FR = new FileReader();
            FR.readAsDataURL(Image3[0]);
            var imageBase3 = FR.result;
            imageBase3 = /,(.+)/.exec(imageBase3)[1];
            requiredData.Image3 = imageBase3;
        }


        ///Image 4
        var Image4 = document.getElementById("Image4").files;
        if (Image4 && Image4[0]) {
            var FR = new FileReader();
            FR.readAsDataURL(Image4[0]);
            var imageBase4 = FR.result;
            imageBase4 = /,(.+)/.exec(imageBase4)[1];
            requiredData.Image4 = imageBase4;
        }    


        requiredData.DiscountPrice = $scope.DiscountPrice;
        VendorService.createUpdateProductDetails(requiredData).then(function (data) {
            $scope.message = data.Message;
            loadProductListForVendor();
            $("#addUpdateProduct").modal("hide");
        }, function (data)
        { data.Message });
    };