i have created a small example which would show spinner when data will be loading. create directive for this because i can reuse it. problem is spinner loading all the time which is not right.

see the code and tell me where i made the mistake ?
',  

link: function (scope, elm, attrs)  

{  

scope.isLoading = function () {  

return $http.pendingRequests.length > 0;  

};  

  

scope.$watch(scope.isLoading, function (v)  

{  

if(v){  

elm.show();  

}else{  

elm.hide();  

}  

});  

}  

};  

}])  

.controller('myController', function($scope, $http) {  

$scope.loadData = function() {  

$scope.students = [];  

$http.get('https://api.myjson.com/bins/x1rqt.json')  

.success(function(data) {  

$scope.students = data[0].students;  

});  

}  

  

});