AngularJS NG-視圖不工作

所以我遵循這個指南：http://viralpatel.net/blogs/angularjs-routing-and-views-tutorial-with-example/AngularJS NG-視圖不工作

但是當我嘗試改變視圖沒有任何反應，任何一個知道我做錯了什麼？

這是我得到的代碼。 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'; 
});

來源

2014-01-07 B13ZT

從角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

來源

2014-01-07 14:32:57

真棒，作品像一個魅力 – B13ZT

角路線需要被包括在內的route模塊。 Here is the documentation涵蓋了這一點。

所以，我認爲你可能會錯過：

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

在頁面的<head>。

*注意：此模塊曾經是Angular的一部分，但最近被移出（1.2？）。所以，一些教程仍然假定$route是內置的。

來源

2014-01-07 14:32:57

不要忘記關閉''標籤！最近把我抓出來了。 –

-1

加入這會工作：

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

，但它不會不上網工作的第一次運行的時候，因此，你應該NG-路徑依賴到項目，並指在HTML文件中

How to add ng-route dependency

來源

2017-05-18 17:47:04 Ashif

請提供一個解決方案，將代碼插入到帖子中，或者只是在問題下面發表評論。謝謝。 –

AngularJS NG-視圖不工作

回答

相關問題