2015-07-10 2 views
0

Я пытаюсь узелJS, SailsJS & Угловой. Я хочу использовать эту полосу загрузки: http://chieffancypants.github.io/angular-loading-bar/ https://github.com/chieffancypants/angular-loading-barМодуль AngularJS загрузочный бар не работает

Я прочитал запрос ручки HTTP полосы загрузки автоматически. так я это сделать:

npm install angular-loading-bar. 

Я поставил Jss и CSS в активах.

Вот мой LoginModule:

var LoginModule = angular.module('LoginModule', ['angular-loading-bar']); 

И мой LoginController:

angular.module('LoginModule') 
    .controller('LoginController', LoginController); 

LoginController.$inject = ['$scope', '$http', 'cfpLoadingBar']; 

function LoginController($scope, $http, cfpLoadingBar) { 

    // Get CSRF token and set as header 
    $http.defaults.headers.post['X-CSRF-Token'] = document.getElementsByName('_csrf')[0].value; 

    $scope.submitLoginForm = function() { 
     $scope.start(); 
     $http.post('/login', { 
       identifiant: $scope.login.identifiant, 
       password: $scope.login.password 
      }) 
      .then(function onSuccess() { 
       window.location = '/home/'; 
      }) 
      .catch(function onError(response) { 
       console.log(response); 
      }) 
    } 

    $scope.start = function() { 
     cfpLoadingBar.start(); 
    }; 
    $scope.complete = function() { 
     cfpLoadingBar.complete(); 
    }; 
} 

Но когда я авторизироваться на моей форме:

<div class="container-fluid" ng-app="LoginModule" ng-controller="LoginController" ng-cloak> 
    <div class=" col-lg-offset-4 col-lg-4"> 
     <div class="panel panel-primary"> 
     <div class="panel-heading"> 
      <h3 class="panel-title">Connexion</h3> 
     </div> 
     <div class="panel-body"> 
      <h5 class="col-lg-12" style="text-align: center">Admin !</h5> 
      <form ng-submit="submitLoginForm()" class="col-lg-offset-3 col-lg-6 form-group" name="loginForm"> 
      <input type="text" class="form-control" id="inputLogin" name="inputLogin" placeholder="Identifiant" ng-model="login.identifiant"> 
      <input type="password" class="form-control" id="inputPassword" name="inputPassword" placeholder="Mot de passe" ng-model="login.password"> 
      <br> 
      <button type="submit" class="btn btn-primary" style="float: right">Connexion</button> 
      <input type="hidden" name="_csrf" value="<%= _csrf %>"> 
      </form> 
     </div> 
     </div> 
    </div> 
    </div> 

Я не вижу бар загрузки, когда Я представляю форму (форма работает) :(Почему? Также, когда я пытаюсь загрузить ngAnimate в LoginModule, у меня есть ошибка

Я попробовал также запуск функции() на элемент HTML, но ничего ..

ответ

1

Вы должны включить angular-animate.min.js, чтобы заставить его работать как и включить в мерзавца, например хранилище. когда я удалил эту строку

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-animate.min.js"></script> 

он прекратил работу, пожалуйста, убедитесь, что вы включили файл анимации. поэтому ngAnimate также дает ошибку

+0

спасибо за вашу помощь. Я включаю файл и теперь у меня есть модуль ngAnimate без ошибок, но панель загрузки всегда не работает :( – zozourban

+1

. Мой плохой, был порядок включения файлов, это woking теперь спасибо! :) – zozourban

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