$ 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-appが「」にある理由はありますか？通常、それは ''または '' – stevenelberger

@stevenelbergerになります。これも動作しない理由の1つです。私は食生活の問題に直面しています。 –

と同じいくつかのコードを持っていますローディング角度の後に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が動作していません

答えて

関連する問題