While loop is not working properly in angularjs

Question

I am trying to use while loop in Angular. If I use alert in while loop, it give same quantity output. but I remove alert, the quantity is different. So what is wrong in my code.

var quantity= $scope.quantity;
var i=0;
while(i< quantity)
        {
                        order.createOrderLineItem( localStorage.getItem( "orderID" ), itemStr, undefined, $scope.errorCallback )
                .success(function(data){
                $scope.lineItemID = data.id;

                alert("i:"+i);
                var orderLineItemData = {};
                if( $scope.cusNote == "" )
                {
                    var existedNote = data.note || "";
                    orderLineItemData = {
                        "unitQty": $scope.quantity,
                        "note": existedNote,
                    };

                    //if adding taxRates 0, clover will returns error
                    if($scope.taxRates !== 0) {
                        orderLineItemData.taxRates = $scope.taxRates;
                    }
                }
                else
                {
                    var customerNote = "";

                    if( data.note != undefined && data.note != null ) customerNote = data.note;

                    customerNote = customerNote + "#order-request-[";
                    customerNote = customerNote + $scope.cusNote;
                    customerNote = customerNote + "]";
                    customerNote = customerNote.replace(/\\/g, '\\\\');
                    customerNote = customerNote.replace(/\"/g, '\\"');

                    console.log( "customerNote:" + customerNote );

                    orderLineItemData = {
                        "unitQty":$scope.quantity,
                        "note": customerNote,
                        "taxRates": $scope.taxRates
                    }
                }

                order.updateOrderLineItem( localStorage.getItem( "orderID" ), $scope.lineItemID, JSON.stringify(orderLineItemData), undefined, $scope.errorCallback )
                    .success( function( data ){
                        if( $scope.modCount == 0 )
                        {
                            location.href = "/" + $routeParams.slug;
                        }

                        $scope.addModifierItem( $scope.lineItemID );
                    });
            });
            i++;
        }

So how can I correct this code?

Seems lik eyou are using async calls within a sync loop... the results are unexpected. — Kinnza, Nov 24 '14 at 10:40
It is not clear from the code example, but it appears as if you want to run all the requests in serial and not in parallel. Is that the case? — musically_ut, Nov 24 '14 at 11:34
User promisses i guess. there is something called async.each but its for nodejs only i think — Kinnza, Nov 24 '14 at 13:21
there is a suggestion here: http://stackoverflow.com/questions/4288759/asynchronous-for-cycle-in-javascript — Kinnza, Nov 24 '14 at 13:22
possible duplicate of [Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference](http://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron) — hon2a, Nov 25 '14 at 07:45
Marked this as a duplicate of [this question](http://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron). Calling `alert()` blocks the current execution, so it gives the asynchronous code time to complete. — hon2a, Nov 25 '14 at 07:47

Utku Apaydin · Answer 1 · 2014-11-25T07:42:53.430

0

I am not sure but, alert may be the reason of that. Can you try to use console.log("i:"+i); instead of the alert. Browser may interrupt when you use alert because of the pop up.

--Edited--

this is the service that you will need to implement into your application. You will need to notify this service at your success and it will trigger any observe that is implemented after the notify

 app.service('checkService',['$q',function($q){
        var checkRequest = $q.defer();

        this.notifyRequestIsDone= function(){
            checkRequest .notify();
        };

        this.observeRequestStatus = function(){
            return checkRequest .promise;
        };
    }]);

Here is observe example of the code above add this to your controller where you need to increase your value after the request is done

checkService.observeRequestStatus ().then(null,null,function(){
    //... Your code
});

edited Nov 25 '14 at 07:42

answered Nov 24 '14 at 11:02

Utku Apaydin

162
1
4

I see that you are requesting a data and doing some work on the success. You should notice that if you are calling a http request there will be a delay on return from server. so if there is no alert the javascript will not wait for the return an increment the "i" but if you add alert it will stop the js until you hit the button on the pop up so this makes a time gap for the request return. You can broadcast or use a defer to get the success properly. I hope this would help you – Utku Apaydin Nov 24 '14 at 11:33
how to use defer in that – Harsh Gandhi Nov 25 '14 at 05:45

While loop is not working properly in angularjs

1 Answers1