2014-01-07 4 views
6

Так я после этого руководства: http://viralpatel.net/blogs/angularjs-routing-and-views-tutorial-with-example/AngularJS нг ракурса не работает

Но когда я пытаюсь не изменить вид ничего не происходит, никого идея, что я делаю не так?

Это код, который я получил. home.php:

<!DOCTYPE html> 
<html ng-app="lax"> 
<head> 
    <meta name="author" content="Koen Desmedt" /> 
    <meta name="description" content="CMS Belgium Lacrosse" /> 
    <meta name="keywords" content='Lacrosse, BLF, Belgium' /> 
    <meta name="googlebot" content="noarchive" /> 
    <link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet">   
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script> 
    <script src="lax.js"></script> 
    <link href="css/style.css" rel="stylesheet">   
    <title>CMS Belgium Lacrosse</title> 
</head> 
<body>   
    <header class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner"> 
     <div class="container"> 
      <div class="navbar-header"> 
       <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse"> 
        <span class="sr-only">Toggle navigation</span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button>      
      </div> 
      <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation"> 
       <ul class="nav navbar-nav navbar-left"> 
        <li> 
         <a href="#/home"> 
          <span class="glyphicon glyphicon-home"></span> BLF 
         </a> 
        </li> 
        <li> 
         <a href="#/players">Players</a> 
        </li> 
        <li> 
         <a href="#/club">Club</a>        
        </li> 
        <li> 
         <a href="#/games">Games</a> 
        </li>       
       </ul>    
      </nav> 
     </div> 
    </header> 
    <div id='contentcontainer'> 
     <div class='container' ng-view></div> 
    </div>   
</body> 
</html> 

lax.js:

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

lax.config(['$routeProvider', 
function($routeProvider) { 
    $routeProvider. 
      when('/home', { 
       templateUrl: 'views/news.php', 
       controller: 'NewsController' 
      }). 
      when('/players', { 
       templateUrl: 'views/players.php', 
       controller: 'PlayersController' 
      }). 
      otherwise({ 
       redirectTo: '/home' 
      }); 
}]); 

lax.controller('NewsController', function($scope) { 
$scope.message = 'This is Add new order screen'; 
}); 


lax.controller('PlayersController', function($scope) { 
$scope.message = 'This is Show orders screen'; 
}); 

ответ

6

От углового 1.2.0, ngRoute был перемещен в его собственный модуль. Вы должны загрузить его отдельно и объявить зависимость.

Обновить ваш HTML:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.js"></script> 

И Js:

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

Для получения дополнительной информации: http://docs.angularjs.org/guide/migration

+0

Awesome, работает как шарм – B13ZT

1

Угловые маршруты требуют route модуля должны быть включены также. Here is the documentation, который покрывает это.

Так что, я думаю, что вы можете пропускать:

<script src="angular-route.js"></script> 

В <head> страницы.

* Примечание: этот модуль был частью Углового, но был удален недавно (1.2?). Итак, некоторые учебники по-прежнему предполагают, что встроен $route.

+1

не забывайте закрывать '' тегов! Недавно выгнал меня. –

-1

Складывая это будет работать:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.js"></script> 

, но он не будет работать без доступа в Интернет при работе в первый раз, поэтому вы должны нг маршрутного зависимости к проекту и обратитесь, что в вашем HTML файле

How to add ng-route dependency

+0

Просьба либо предоставить решение с кодами, вставленными в сообщение, либо просто оставить комментарий ниже вопроса. Спасибо. –

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