How to add a spinner while loading the content in AngularJS?

Question

I am using button spinner while loading the content, when the user clicks on the \"Search\" button content will load, at this time buttonLabel will be changed t

Answer 1

Just add an ng-show to your spinner:

and controller:

.controller("LocationFormCtrl", function ($scope) {
    $scope.searchButtonText = "Search";
    $scope.loading = false;
    $scope.test="false";
    $scope.search = function() {
      $scope.test="true";
      $scope.loading="true"
      $scope.searchButtonText = "Searching";
      // Do your searching here
   }
});

Then, when you get your response, set $scope.loading to false again

Demo