var myapp = angular.module('sampleapp', [ ]); myapp.controller('samplecontoller', function ($scope) { $scope.loading = false ; $scope.onSubmit = function(){ $scope.loading = true ; } $scope.cancel = function(){ $scope.loading = false ; } });
<div ng-app="sampleapp"> <div ng-controller="samplecontoller"> <form ng-submit="onSubmit()" class="form"> <p>Click on save button</p> <div class="form-actions"> <button class="btn btn-primary"> <span data-ng-hide="loading"> Save </span> <span data-ng-show="loading"> Saving <i class="fa fa-spinner fa-spin"></i> </span> </button> </div> </form> <div class="cancel"> <p>Click to Cancel</p> <button class="btn" ng-click="cancel()">Cancel</button> </div> </div> </div>
.form{ padding:20px } .cancel{ padding:20px; }