2016-08-05 5 views
0

Это очень простой и все же мой category.view.html внутри моей папки просмотра (которая состоит из lorum ipsum) не отображается внутри контейнера div.App view controller не работает

Это HTML

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


    <title>Mwiki</title> 

    <!-- Bootstrap core CSS --> 
    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> 
    <!-- Custom styles for this template --> 
    <link href="stylesheets/style.css" rel="stylesheet"> 

    </head> 

    <body> 

    <nav class="navbar navbar-inverse"> 
     <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#">Knowledgebase</a> 
     </div> 
     <div id="navbar" class="collapse navbar-collapse"> 

     </div><!--/.nav-collapse --> 
     </div> 
    </nav> 

    <div class="container"> 
     <div ng-view></div> 
    </div> 
    <footer> 
    <p> &copy; 2016 Wiki App</p> 
    </footer> 

    <!-- Bootstrap core JavaScript 
    ================================================== --> 
    <!-- Placed at the end of the document so the pages load faster --> 
    <script src="bower_components/angular/angular.min.js"></script> 
    <script src="bower_components/angular-route/angular-route.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> 
    <script src="controllers/articles.controller.js"></script> 
    <script src="controllers/categories.controller.js"></script> 
    <script src="app.js"></script> 
    </body> 
</html> 

Это app.js файл, который находится непосредственно в той же папке, как мой index.html

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

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/categories', { 
    templateUrl: 'views/categories.view.html', 
    controller: 'CategoriesCtrl' 
    }); 
}]); 

.controller('CategoriesCtrl', [function($scope) { 
console.log($scope); 
}]); 
+0

Вы получаете какую-либо ошибку в консоли? –

ответ

0

Удалите точку с запятой после вашей функции конфигурации (или добавьте приложение перед своим контроллером). Также не забудьте комментировать.

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

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/categories', { 
    templateUrl: 'views/categories.view.html', 
    controller: 'CategoriesCtrl' 
    }); 
}]) 

.controller('CategoriesCtrl', ['$scope', function($scope) { 
console.log($scope); 
}]); 

Я не проверял это, но он должен работать.

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