Delay in hiding a button using Ng-Hide in Angular JS

Question

]

There is some sort of a delay when I am using ng-hide/ng-show and it's bothering me very much. But when executed a similar in JS Fiddle it works fine. Here is the JS Fiddle

Any reason why it's happening? And how can I fix it?

<div ng-controller="MyCtrl">
  Hello, {{name}}!
  <button class="btn btn-warning" ng-show="isDisabled">HI</button>
  <button class="btn btn-primary" ng-hide="isDisabled">BYE</button>
  <a ng-click='relink()'> Link me to my existing account</a>
</div>

Controller:

var myApp = angular.module('myApp', []);
  function MyCtrl($scope) {
     $scope.name = 'Superhero';
     $scope.isDisabled = false;
     $scope.relink = function() {
        $scope.isDisabled = !$scope.isDisabled;
      }
    }

Answer 1

try this css once

.btn.ng-animate { transition:0s none;
       -webkit-transition:0s none;
       animation: 0s none;
       -webkit-animation: 0s none; }