2017-03-17 2 views
2

각도 응용 프로그램을 실행하려고하는데 문제가 있습니다. 내가 NPM과 실행 갔지 는 내가 가진 설치 이것은 내가 안 내 app.js ReferenceError : 각도가 정의되지 않았습니다. Angularjs

'use strict'; 

angular.module('MyApp', ['ui.bootstrap']); 


// Declare app module and Appendages 
angular.module('MyApp', ['ngCookies']) 
    .config(['$routeProvider', function($routeProvider) { 
    $routeProvider 
     .when('/home', { 
     title: 'Home', 
     templateUrl: 'front/login.html', 
     //controller: 'loginctrl.js' 
     }) 
     .otherwise({redirectTo: '/home'}); 
    }]) 
    .run(function($cookieStore, $rootScope, $http) { 
    if ($cookieStore.get('djangotoken')) { 
     $http.defaults.headers.common['Authorization'] = 'Token ' + $cookieStore.get('djangotoken'); 
     //document.getElementById("main").style.display = "block"; 
    } else { 
     document.getElementById("login-holder").style.display = "block"; 
    } 
    }); 

의 코드 그리고 내 HTML 파일

<!DOCTYPE html> 
<html ng-app="MyApp"> 
<head> 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 


<script src="js/jquery-1.11.2.min.js"></script> 
<script src="bower_components/angular/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script> 
<script src="js/app.js"></script> 
<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script> 
<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/svg-assets-cache.js"></script> 
<script src="https://cdn.gitcdn.link/cdn/angular/bower-material/v1.1.1/angular-material.js"></script> 
<script src="../prefixfree/prefixfree.js"></script> 
<script src="../prefixfree/prefixfree.min.js"></script> 


<script src="js/loginctrl.js"></script> 
<script src="js/variablesGlobales.js"></script> 
<script src="js/headerfooter-login.js"></script> 
<link rel="stylesheet" type="text/css" href="CSS/styleLanding.css"> 





    <title>Landing Page</title> 
</head> 
<body ng-controller="loginctrl"> 
<div class="container-fluid"> 
    <div id="headerl"> 
    </div> 
    <div class="content-bar col-lg-12 col-md-12 col-sm-12"> 
     <h1>Lorem Ipsum Dolor Sit Amet</h1> 
     <h3>Li Europan lingues es membres del sam familie. Lor separat</h3> 
      <button data-toggle="modal" data-target="#squarespaceModal" class="get"> 
       Get Started 
     </button> 
    </div> 

    <div class="center"> 
      <div class="modal fade" id="squarespaceModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true"> 
       <div class="modal-dialog"> 
        <div class="modal-content"> 
         <div class="modal-header" > 
          <button type="button" class="close" data-dismiss="modal" id="close"> 
           <span aria-hidden="true" class="X">X</span> 
          </button> 

          <h3 class="modal-title" id="lineModalLabel"></h3> 
         </div> 


         <div class="modal-header" id="barraL"> 
          <button type="button" class="close" data-dismiss="modal"></button> 
          <h3 class="modal-title" id="lineModalLabel">LOGIN</h3> 
         </div> 

       <div class="modal-body"> 
        <div ng-controller="loginctrl"> 
         <form> 
          <div class="form-group"> 
          <label for="exampleInputEmail1" class="email">Email</label> 
          <input class="form-control" id="InputEmail1" ng-model="emailu" > 
          </div> 
          <div class="form-group"> 
          <label for="exampleInputPassword1" class="password">Password</label> 
          <input type="password" class="form-control" id="InputPassword1" ng-model="passwordu" > 
          </div> 

          <button type="submit" class="confirm" id="boton" ng-click="sendlgctrl()"><!--a href="disclaimer.html"--><a style="text-decoration:none; color:#ffffff;" >Confirm</a></button> 

         </form> 
        </div> 

       </div> 

      </div> 
      </div> 
     </div> 
    </div> 
</div> 


</body> 
</html> 

입니다

ReferenceError: angular is not defined 
    at Object.<anonymous> (C:\Users\GrupoBECM18\Documents\Proyectos\StockPitch-Web\front\js\app.js:4:1) 
    at Module._compile (module.js:570:32) 
    at Object.Module._extensions..js (module.js:579:10) 
    at Module.load (module.js:487:32) 
    at tryModuleLoad (module.js:446:12) 
    at Function.Module._load (module.js:438:3) 
    at Module.runMain (module.js:604:10) 
    at run (bootstrap_node.js:394:7) 
    at startup (bootstrap_node.js:149:9) 
    at bootstrap_node.js:509:3 

다음 문제가 뭔지 아는 사람 :(누군가가 나를 도울 수 있기를 바랍니다.) 이미 노드, 각도 및 모든 것을 설치했지만 아무 것도 작동하지 않고 이유를 모르겠습니다.

+0

아마도 당신을 배치해야 문제를 해결할 수 있습니다 다음 컨트롤러 등등 .. 희망 각도 JS 파일을 삽입해야한다 또한 마음에

유지 문서 준비가 초기화 되었습니까? – stackoverfloweth

+0

이 오류가 발생하면 각도 모듈 자체를로드하기 전에 각도 의존성 모듈을 초기화해야하기 때문에 항상 그렇습니다. – yeaske

답변

0

동일한 모듈을 두 번 초기화하십시오. 그냥 두 가지 문제

(I) 모듈은 모든 종속성을 한 번에 주입해야이 있습니다

변경하면이

angular.module('MyApp', ['ui.bootstrap','ngCookies']);

+0

나는 그것을했지만 여전히 작동하지 않습니다. 나는 같은 오류가있다. –

2

angular.module('MyApp', ['ui.bootstrap']); 
// Declare app module and Appendages 
angular.module('MyApp', ['ngCookies']) 

를 모듈을 초기화,

angular.module('MyApp', ['ui.bootstrap','ngCookies']); 

(ii) 귀하 app.js

<script src="js/jquery-1.11.2.min.js"></script> 
<script src="bower_components/angular/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.js"></script> 
<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script> 
<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/svg-assets-cache.js"></script> 
<script src="https://cdn.gitcdn.link/cdn/angular/bower-material/v1.1.1/angular-material.js"></script> 
<script src="../prefixfree/prefixfree.js"></script> 
<script src="../prefixfree/prefixfree.min.js"></script> 
<script src="js/app.js"></script> 
+0

그랬지만 여전히 작동하지 않습니다. –

+0

@ EnyaValeriaMartínez 주문을 확인하고 스크립트가로드되는지 확인 했습니까? – Sajeetharan

1

내 첫번째 생각 인 index.html을 모든 각도 참조를로드 한 후로드해야합니다 : 두 번 모듈을 선언 한 이유는 무엇입니까?

angular.module('MyApp', ['ui.bootstrap']); 


// Declare app module and Appendages 
angular.module('MyApp', ['ngCookies']) 

'angular.module'의 두 번째 인수에서 []를 사용하면 모듈을 선언하고 그 의존성을 주입합니다. 그러나 두 번째 인수없이 동일한 구문을 사용하면 모듈을 호출 할 수 있습니다.

angular.module('MyApp', ['ui.bootstrap','ngCookies']); 

angular.module('MyApp').config.... 

그럼 다시, 내가 문제입니다 확실하지 오전 :

무엇을하기를 원하십니까해야한다. 나는 또한 당신이 Js와 css 파일을 (머리)에 주입했다는 것을 알아 차렸다. 이로 인해 문제가 발생할 수 있으며 파일을 (body)의 끝에로드하는 것이 좋습니다. 주문 문제, 당신은 다음, 모듈,

관련 문제