Question

我用HTML编写一个小代码

<html ng-app="myApp">
    <head>
    <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js' ></script>
    <script src='//ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular-animate.js' /></script>
    <script src='./hello.js' ></script>
<style>
    .sample-show-hide {
  padding:10px;
  border:1px solid black;
  background:white;
}

.sample-show-hide {

  -webkit-transition:all linear 3s;
  transition:all linear 3s;

}

.sample-show-hide.ng-hide {
  opacity:0;
}

</style>
    </head>
    <body ng-controller='Sample'>
        <div class='sample-show-hide' style='z-index:2;' ng-init='timeout=false;' ng-hide='timeout'> Unable to get location </div>

    </body>
</html>

其中hello.js代码是

   var myApp = angular.module('myApp',[]);
    myApp.controller('Sample',function($timeout,$scope){
    console.log('coming here');
    $timeout(function(){
        console.log('coming here again');
        $scope.timeout=true;
    },2000);
});

但在我的代码中动画不起作用。任何人都可以告诉它为什么不能正常工作？

Answer 1

var myApp = angular.module('myApp',["ngAnimate"]);

试试这段代码：）

Angular.js动画无法正常工作

1 个答案: