将ngAnimate添加到控制器使应用程序不显示内容

时间:2015-01-12 00:24:16

标签: javascript html angularjs

我尝试使用ng-inculde更改html中的内容时添加动画,但是当我在控制器的声明中添加[' ngAnimate']所有内容时主要标签内部只是消失。

HTML:

<div ng-app="myApp">
    <div  ng-controller="firstCtrl">
        <div id="wrapper">
            <main ng-init="nav('data/table.html')">
                <div ng-include="filePath">
                </div>
            </main>
        </div>
    </div>
</div>

JS:

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


myApp.controller ('firstCtrl', function($scope, PersonService){

    $scope.users = PersonService.list();
    $scope.saveUser = function () {
        PersonService.save($scope.newuser);
        $scope.newuser = {};
    }


    $scope.nav = function(path){
        $scope.filePath = path;
    }
})

此代码无法正常工作,因为即时添加[&#39; ngAnimate&#39;]但如果我删除它并将括号保持为空,则会显示内容。可以有人告诉我为什么以及在内容发生变化时获取动画的正确方法(table.html更改为其他文件)

这是所需的标题部分:

<head lang="en">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular-sanitize.js"></script>
    <script src="https://code.angularjs.org/1.2.6/angular-animate.js"></script>
    <script src="js/angular.min.js"></script>
</head>

1 个答案:

答案 0 :(得分:0)

提供angular-animate.min.js文件的参考,以便使用'ngAnimate'模块。你必须在angular.min.js之后提供这个文件的参考。