$ routeProvider無法正常工作

我正在使用angularJs，並且新增了它。我在$ routeProvider中遇到問題。

在此先感謝，如果有人可以幫助我:)

我沒有得到在控制檯的任何錯誤，但ngView也沒有更新

的index.html

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

<!-- Bootstrap Core CSS --> 
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"> 

<!-- Custom CSS --> 
<link href="css/main.css" rel="stylesheet" type="text/css"> 

<!-- AngularJS script --> 
<script type="text/javascript" src="js/angular.min.js"></script> 
<script type="text/javascript" src="js/app.js"></script> 
<script type="text/javascript" src="js/route.min.js"></script> 
<script src="js/jquery.min.js"></script>

<div id="wrapper"> 
    <!-- Navigation --> 
    <nav class="navbar navbar-default navbar-static-top" role="navigation" 
     style="margin-bottom: 0"> 
     <div class="navbar-header"> 
      <a class="navbar-brand" href="/">Demo Work</a> 
     </div> 
     <div class="navbar-default sidebar" role="navigation"> 
      <div class="sidebar-nav navbar-collapse"> 
       <ul class="nav" id="side-menu"> 
        <li> 
         <a href="#">Dashboard</a> 
        </li> 
        <li> 
         <a href="#">Charts</a> 
          <ul class="nav nav-second-level"> 
           <li><a href="#">Flot Charts</a></li> 
           <li><a href="#">Morris.js Charts</a></li> 
          </ul> 
        </li> 
        <li> 
         <a href="#tables">Tables</a> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </nav> 

    <!-- Page Content --> 
    <div id="page-wrapper"> 
     <div data-ng-view> 
     </div> 
    </div> 
    <!-- /#page-wrapper --> 
</div> 
</body> 
</html>

dashboard.html

<div> 
    <h1>Contact Page</h1> 
    <p>{{ message }}</p> 
</div>

tables.html 它也有一些代碼相同dashboard.html

app.js

var demoProject = angular.module('myApp',['ngRoute']); 
demoProject.config(function($routeProvider) { 
    $routeProvider 
    .when('/',{ 
     templateUrl : 'page/dashboard.html', 
     controller : 'contactController' 
    }) 
    .when('/tables',{ 
     templateUrl: 'page/tables.html', 
     controller: 'tablesController' 
    }); 
}); 

demoProject.controller('contactController', function($scope) { 
    // create a message to display in our view 
    $scope.message = 'Everyone come and see how good I look!'; 
}); 

demoProject.controller('tablesController',function($scope){ 
    console.log("Tables controller"); 
});

來源

2016-08-16 Abhishek Kumar

要吸引更多答案，請附上一張plnkr。 –

是否有一個原因ng應用程序在''？通常它會出現在''或'' – stevenelberger

@stevenelberger之一，這也是無法正常工作的原因之一。但我正面臨着日蝕的問題。感謝您的建議 –

您需要加載角度後加載app.js路線

<script type="text/javascript" src="js/angular.min.js"></script> 
<script type="text/javascript" src="js/route.min.js"></script> 
<script type="text/javascript" src="js/app.js"></script>

來源

2016-08-16 16:53:50 Sajeetharan

我根據您的建議對代碼進行了修改，但無法使用。 ngView不更新 –

添加視圖路徑的'/'盈方。 templateUrl：'page/tables.html'， – Sajeetharan

我認爲它已經在那裏了。 –

$ routeProvider無法正常工作

回答

相關問題