정의되지 않은 컨트롤러 AngularJS

Question

내 템플릿이로드되고 있지만 컨트롤러가 정의되지 않았다고 오류가 발생합니다. 컨트롤러는 내 소스에 정의 된 위치에 정확히 존재합니다. 이 코드의 문제점은 무엇입니까?

Error: [ng:areq] Argument '/Scripts/controllers/wizardNavigationCtrl.js' is not a function, got undefined 
http://errors.angularjs.org/1.2.14/ng/areq?p0=%2FScripts%2Fcontrollers%2FwizardNavigationCtrl.js&p1=not%20aNaNunction%2C%20got%20undefined 

Index.html을 (루트 페이지)

<div class="container"> 
    <div ui-view></div> 
</div> 

wizardLayout.html

<div> 
    <ul class="nav nav-tabs"> 
     <li ng-repeat="model in models" ng-class="active: model.active"> 
      <a ui-sref=".model-{{model.name}}">model.name</a> 
     </li> 
     <li ng-class="navStep=='addnew' ? 'active' : ''"> 
      <a ui-sref=".newmodel"><span class="glyphicon glyphicon-plus"></span></a> 
     </li> 
     <li><a ui-sref=".other">Other</a></li> 
     <li><a ui-sref=".customer">Customer Info</a></li> 
     <li><a ui-sref=".shipping">Shipping Info</a></li> 
     <li><a ui-sref=".review">Review</a></li> 
    </ul> 
</div> 

<div ui-view> 
</div> 

app.js :

'use strict'; 

var myApp = angular.module('myApp', ['ui.router']); 

myApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { 
    $stateProvider 
     .state('wizard', { 
      url: '/', 
      templateUrl: 'Scripts/templates/wizardLayout.html', 
      controller: 'Scripts/controllers/wizardNavigationCtrl.js' 
     }) 
     .state('wizard.newmodel', { 
      url: '/newmodel', 
      templateUrl: 'Scripts/templates/wizardModel.html', 
      controller: 'Scripts/controllers/wizardModelCtrl.js' 
     }) 
     .state('wizard.other', { 
      url: '/other', 
      templateUrl: 'Scripts/templates/wizardOther.html', 
      controller: 'Scripts/controllers/wizardOtherCtrl.js' 
     }) 
     .state('wizard.customer', { 
      url: '/customer', 
      templateUrl: 'Scripts/templates/wizardCustomer.html', 
      controller: 'Scripts/controllers/wizardCustomerCtrl.js' 
     }) 
     .state('wizard.shipping', { 
      url: '/shipping', 
      templateUrl: 'Scripts/templates/wizardShipping.html', 
      controller: 'Scripts/controllers/wizardShippingCtrl.js' 
     }) 
     .state('wizard.review', { 
      url: '/review', 
      templateUrl: 'Scripts/templates/wizardReview.html', 
      controller: 'Scripts/controllers/wizardReviewCtrl.js' 
     }); 
    }]); 

wizardNavigationCtrl.js

myApp.controller('wizardNavigationCtrl', ['wizardSvc', '$scope', function (wizardSvc, $scope) { 
    alert('navigation controller! ' + wizardSvc.quote.title); 
    $scope.navStep = 'addnew'; 
    wizardSvc.init(); 
}]) 

Answer 1

제어기의 형식은 MyControllerName이어야하며 javascript 파일의 이름과 경로가 아니어야합니다. 그 점을 염두에두고, 컨트롤러를 사용하기 위해서는 자바 스크립트가 이미 브라우저에 의해로드되어 있어야합니다. 각도는 이러한 스크립트를 찾거나로드하지 않으므로 기존 script 태그를 사용해야합니다.

.state('wizard', { 
     url: '/', 
     templateUrl: 'Scripts/templates/wizardLayout.html', 
     controller: 'wizardNavigationCtrl' 
    }) 

을 그리고 어딘가에 페이지에서 다음이 필요합니다 :

코드에서 조각을 촬영이 될 수 있습니다

<script src="Scripts/controllers/wizardNavigationCtrl.js" type="text/javascript"></script> 

희망을!