Show progress circular during $http post?

Question

What is the best way to use Angular Material\'s Progress circular component with a $http request?

I currently have the code like this below:

Progre

Answer 1

First set some model:

$scope.loading=false;

Bind that model with progress circular element ng-show property:

Set it to true before calling $http request and set it to false on $http .success:

$scope.loading=true;

$http.get("/posts")
   .success(function (data) {

      $scope.posts = data;

      $scope.loading=false;

   })

Hope that helps.