AngularJS 여러 개의 JS 파일 및 디렉토리를 포함하는 라우팅

임 Angular에 새로운 점이 있고 라우팅에 문제가있어서 간단하게 설정했지만 여전히 작동하지 않습니다.AngularJS 여러 개의 JS 파일 및 디렉토리를 포함하는 라우팅

index.html을 :

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 

    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" /> 
    <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css" /> 


</head> 
<body ng-app="app"> 
<div>{{1+1}} 
    <ng-view>Loading...</ng-view> 
</div> 

<script type="text/javascript" src="bower_components/angular/angular.js"></script> 
<script type="text/javascript" src="bower_components/angular-resource/angular-resource.min.js"></script> 
<script type="text/javascript" src="bower_components/angular-route/angular-route.js"></script> 
<script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script></script> 

<script type="text/javascript" src="app.js"></script> 
<script type="text/javascript" src="components/billing/billing.js"></script> 

<script> 

</script> 
</body> 
</html>

app.js :

'use strict'; 

var app = angular.module('app', [ 
    'ngRoute', 
    'billing' 
]); 

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider 
     .when('/billing', {templateUrl: 'components/billing/billing.html', controller: BillingCtrl}) 
     .otherwise({redirectTo: '/billing'}); 
}]);

구성 요소/결제/billing.js :

'use strict'; 

var billing = angular.module('billing', []); 

billing.controller('BillingCtrl', [function($scope) { 
     var model = { 
      user: "Adam", 
      items: [{ action: "Buy Flowers", done: false }, 
       { action: "Get Shoes", done: false }, 
       { action: "Collect Tickets", done: true }, 
       { action: "Call Joe", done: false }] 
     }; 

     $scope.todo = model; 
}]);

구성 요소/결제/billing.html :

<div>Hello world {{todo.user}}</div>

내가 읽은 것부터 기본 라우팅이므로 ng-view에 billing.html을 포함시켜야합니다. 하지만 내가 얻는 것은 '로드 중 ...'입니다.

어떤 도움을 주셔서 감사합니다.

출처

2015-01-24 Stefan

라우트에 대한 컨트롤러를 지정할 때, 컨트롤러 기능에 대한 참조가 아닌 컨트롤러 이름 (문자열)이어야합니다.

$routeProvider 
    .when('/billing', { 
     templateUrl: 'components/billing/billing.html', 
     controller: "BillingCtrl" 
    })

출처

2015-01-24 23:28:43

완벽한 작품 (BillingCtrl 주위에 따옴표를 주목하라). 고맙습니다! – Stefan

후속 질문입니다. 컨트롤러를이 방법으로 지정하면 여전히 billing.html에 ng-controller 속성이 필요합니까? 현재 범위 변수에 액세스 할 수없는 것 같습니다. – Stefan

아니요, 그렇지 않습니다. 여기서 지정하거나'ng-controller '를 통해 지정하십시오. –

AngularJS 여러 개의 JS 파일 및 디렉토리를 포함하는 라우팅

답변

관련 문제