I want to add loader using angularjs

Viewed 22

I want to add a loader image after clicking on submit Button first i want to loader for 4-5 sec and then want to come the data of GetData() method.

<div class="loader" align="center" ng-show="ShowLoader">
      <img src="abc.png" style="width: 160px; height:80px; margin-top: 100px;" />
    </div>




<button type="submit" class="btn btn-primary center" id="submitform" ng-click="GetData()" value="save">Submit</button>





<script>
$scope.ShowLoader = false;
$scope.GetData = function () {
    $scope.ShowLoader = true;
    setTimeout(function () {
        $scope.$apply(function () {
            $scope.ShowLoader = false;
        });
    }, 2000);
    $http({
        method: 'POST',
        url: '',
        headers: {
            'Content-type': 'application/json'
        }    })
        .then(function (response) {                
            $scope.ShowLoader = false;
            $scope.GetData = response.data;
            
        }, function (response) {
            $scope.ShowLoader = false;
        });    
</script>
0 Answers
Related