xmlhttprequest - AngularJs server request queue or function is not call -
i've subscribed in controller on socket event. when event has come, need data server (i try call lb.get() function factory).
$scope.counter = 0; $scope.$on('levent', function (event, response) { // socket event $scope.counter ++; console.log('counter '+$scope.counter); lb.get(response[0]).then(function(response){ var item = { id: response.id, mime: response.mime, name: response.name, }; $scope.items.push(item); console.log("$scope.items"+$scope.items.length); }); }); // here function in factory get: function(id) { deferred = $q.defer(); $http({ method: "post", url: url, data: $.param({id: id}), headers: header }) .success(function (data) { deferred.resolve(data); }) .error(function (data) { deferred.reject(data); }); return deferred.promise; }
imagine, i've got 5 socket events, function lb.get() has called 4 (or 3) times instead of 5. can see result of calling in console:
as can see, function lb.get() called 4 times instead of 5.
i think, need request queue.
you don't have handle
error response method get
. maybe in case, response disappear.
you don't need request queue.
see example on jsfiddle.
angular.module('exampleapp', []) .controller('exampleonecontroller', function($scope, serviceexample) { $scope.counter = 0; $scope.successcounter = 0; $scope.errorcounter = 0; $scope.$on('raise.event', function(event, value) { console.log('counter', $scope.counter); $scope.counter++; serviceexample.get(value).then(function() { console.log('success response:', $scope.successcounter); $scope.successcounter++; }).catch(function() { console.log('error response:', $scope.errorcounter); $scope.errorcounter++; }); }); }) .controller('exampletwocontroller', function($scope) { $scope.raisevalue = "www.google.com" $scope.raise = function(val) { $scope.$emit('raise.event', val); }; }) .service('serviceexample', function($http) { return { get: function(url) { return $http({ method: "get", url: url }); } } });
.errors { color: maroon }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="exampleapp"> <div ng-controller="exampleonecontroller"> <h3> exampleonecontroller </h3> <form name="exampleform" id="exampleform"> <pre>counter : {{counter}}</pre> <pre>successcounter: {{successcounter}}</pre> <pre class="errors">errorcounter: {{errorcounter}}</pre> </form> <div ng-controller="exampletwocontroller"> <h3> exampletwocontroller </h3> <form name="exampleform" id="exampleform"> <input ng-model="raisevalue"> <br> <button ng-click="raise(raisevalue)" simple> send request "{{raisevalue}}" </button> </form> </div> </div> </body>
Comments
Post a Comment