2017-03-21 10 views
0

私は小さな角度のアプリケーションを作っていますが、ディレクティブとビューはレンダリングされていません、私は既に私のコードを調べましたが、下記の見:AngularJS(1)ビューとディレクティブが動作しません

Index.htmlと

<!DOCTYPE html> 
<html lang="pt-br" ng-app="rdi_music"> 

<head> 
<base href="/"> 
<meta charset="UTF-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 

<!-- Carregando CSS --> 
<link rel="stylesheet" href="css/bootstrap.min.css"> 
<link rel="stylesheet" href="css/bootstrap-overloads.css"> 

<!--Carregando os scripts--> 
<!-- App core --> 
<script src="js/core/angular.min.js"></script> 
<script src="js/core/angular-animate.min.js"></script> 
<script src="js/core/angular-sanitize.min.js"></script> 
<script src="js/core/angular-route.min.js"></script> 
<script src="js/core/angular-resource.min.js"></script> 
<script src="js/ui/ui-bootstrap-tpls-2.5.0.min.js"></script> 

<!-- My Modules --> 
<script src="js/main.js"></script> 
<script src="js/controllers/index-controller.js"></script> 
<script src="js/controllers/musicas-controller.js"></script> 

<!-- My Directives --> 
<script src="js/directives/header.js"></script> 

<title>Music</title> 
</head> 

<body> 

<header-menu></header-menu> 

<div class="container"> 
    <ng-view></ng-view> 
</div> 
</body> 

</html> 

main.js

angular.module('rdi_music', ['ngRoute', 'ngResource', 'musicasController', 
'header']) 
.config(function($routeProvider, $locationProvider){ 
$locationProvider.html5Mode(true); 

$routeProvider.when('/musicas',{ 
    templateUrl: 'views/musicas/index.html', 
    controller: 'musicasController' 
}); 
}); 

インデックスcontroller.js

angular.module('rdi_music', ['ngAnimate', 'ngSanitize', 'ui.bootstrap']) 
.controller('indexController',function($scope){ 
$scope.isNavCollapsed = true; 
$scope.isCollapsed = true; 
$scope.isCollapsedHorizontal = true; 
}); 

musicas-controller.js

angular.module('rdi_music', ['ui.bootstrap']) 
.controller('musicasController', function($scope){ 

}); 

header.jsモジュールはangular.module不要に注入後

答えて

0
angular.module('header', ['ui.bootstrap']) 
.directive('headerMenu', function(){ 
var ddo = { 
    restrict: "AE", 
    templateUrl: "views/directives/header.html" 
}; 

return ddo; 
}); 

それらを再び注入する。参照のみを取得してください。

モジュールインジェクタから 'musicasController'を削除します。コントローラは、モジュール

angular.module('rdi_music', ['ngRoute', 'ngResource', 
'header']) 
.config(function($routeProvider, $locationProvider){ 
$locationProvider.html5Mode(true); 

$routeProvider.when('/musicas',{ 
    templateUrl: 'views/musicas/index.html', 
    controller: 'musicasController' 
}); 
}); 

インデックス-controller.js

angular.module('rdi_music') 
.controller('indexController',function($scope){ 
$scope.isNavCollapsed = true; 
$scope.isCollapsed = true; 
$scope.isCollapsedHorizontal = true; 
}); 

musicas-controller.js

angular.module('rdi_music') 
.controller('musicasController', function($scope){ 

}); 

Demo

に注入する必要はありません。
関連する問題