2014-02-04 2 views
0

Я пытаюсь представить анимацию в своем приложении, однако, когда я включаю зависимость ngAnimate в моем приложении, она не загружается, и я не получаю никаких ошибок в консоли, которая делает ее довольно трудно отлаживать.ngAnimate зависимость, вызывающая приложение, не отображаемое

index.html:

<html> 
<head > 
    <!-- Styles --> 
    <link rel="stylesheet" type="text/css" href="/Style%20Library/projects/spDash/app/css/main.css"/> 
    <link rel="stylesheet" type="text/css" href="/Style%20Library/projects/spDash/app/css/sidebar.css"/> 

    <!-- Bootstrap --> 
    <link rel="stylesheet" href="/Style%20Library/projects/spDash/app/css/bootstrap3.css"> 
</head> 

<body> 
    <div id="mdContainer" ng-cloak> 
     <!-- Navigation --> 
     <div id='mdSidebar'> 
      <ul> 
       <li id="menuHome"><a href='#/home'><span>Home</span></a></li> 
       <li id="menuUsers"><a href='#/userView'><span>Users</span></a></li> 
       <li id="menuGroups"><a href='#/groupView'><span>Groups</span></a></li> 
       <li id="menuSites"><a href='#/sitesView'><span>Sites</span></a></li> 
       <li id="menuReports"><a href='#'><span>Reports</span></a></li> 
      </ul> 
     </div> 

     <!-- Main view --> 
     <ng-view> 
      <div class="mainView"> 
       <h1 class="topPanel">This is place holder text until I build a home page</h1> 
      </div> 
     </ng-view> 
    </div> 

    <!-- Scripts --> 
    <script type="text/javascript" src="https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/spAppLoader.js"></script> 
</body> 
</html> 

scriptAppLoader.js:

$LAB 
    .script("//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-animate.js") 
    .script("//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-route.js") 
    /*.script("//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-route.min.js")*/ 
    /*.script("//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-animate.min.js")*/ 
    /*.script("//cdnjs.cloudflare.com/ajax/libs/select2/3.4.5/select2.min.js")*/ 
    .script("//cdnjs.cloudflare.com/ajax/libs/select2/3.4.5/select2.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/app.js") 
    .script("//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap-tpls.min.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/controllers/userCtrl.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/controllers/groupCtrl.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/controllers/newGroupCtrl.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/controllers/siteCtrl.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/services/userServices.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/services/groupServices.js") 
    .script("https://hosted.compulite.ca/Style%20Library/projects/spDash/app/js/services/siteServices.js") 
    .wait(function(){ 
      var root = document.getElementById('mdContainer') 
      angular.bootstrap(root ,['spApp']); 
     }) 

app.js:

var spApp = angular.module('spApp', ['ngRoute','ngAnimate','ui.bootstrap']) 
    .config(function($routeProvider, $locationProvider){ 
     var rootUrl = '/Style%20Library/projects/spDash/app/partials/'; 

     $routeProvider 
     .when('/home', 
     { 
      templateUrl: rootUrl+'home.html' 
     }) 
     .when('/userView', 
     { 
      templateUrl: rootUrl+'userView.html', 
      controller: 'userCtrl' 
     }) 
     .when('/groupView', 
     { 
      templateUrl: rootUrl+'groupsView.html', 
      controller: 'groupCtrl' 
     }) 
     .when('/sitesView', 
     { 
      templateUrl: rootUrl+'sitesview.html', 
      controller: 'sitesCtrl' 
     }) 
     .otherwise({redirectTo:'/home'}); 
     //$locationProvider.html5Mode(true); 
    }); 
+0

Вы проверили содержимое файла animate.js в своих источниках, чтобы узнать, есть ли у него контент? – mattl

+0

Какая ошибка вы получаете в консоли? Кроме того, где вы включаете угловой? Ваш скриптAppLoader запускается с анимацией, а угловая не загружается на страницу. – TheSharpieOne

+0

Yup, я получаю их из Google CDN, а также пробовал код .angular cdn – Batman

ответ

3

angular.js была версия 1.2.4

угловая -animate.js была версия 1.2.10

Обновление, так что это самые последние версии, и вы в порядке.

+0

Ayone имеет проблемы с 1.3.15 в так же ? Он просто не распознает проверенный и загруженный файл angular-animate.js ... Ввести вот так ... --- angular.module ('baApp') .controller ('MainCtrl', ['$ scope », '$ местоположение', 'localStorageService', 'ngAnimate' ... – landed

Смежные вопросы