2017-12-01 9 views
0

AngulaJSサンプルアプリケーションでルーティングを実装しようとしていますが、何とか動作していないため、何らかのエラーが発生していません。ここで私を助けてください。私は最後の一日から完全にここで立ち往生しています。ここでAngulaJSルーティングが機能していないため、エラーが発生していません

は、コードの詳細は以下のとおりです。

Index.htmlと

<!DOCTYPE html> 
<html ng-app="AngularJS"> 
<head> 
    <title>Index page</title> 
    <meta charset="utf-8" /> 
    <link href="../Styles/Layout.css" rel="stylesheet" /> 
    <script src="../Scripts/Vendors/angular.js"></script> 
    <script src="../Scripts/Vendors/angular-route.js"></script> 
    <script src="../Scripts/app.js"></script> 
    <script src="../Scripts/Controllers/Index.js"></script>  
</head> 
<body> 
    <table> 
     <tr> 
      <td colspan="2" class="header"> 
       <h2>Website header</h2> 
      </td> 
     </tr> 
     <tr> 
      <td class="leftMenu"> 
       <a href="#/Home">Home</a> 
       <a href="#/Courses">Courses</a> 
      </td> 
      <td class="mainContent"> 
       <ng-view></ng-view> 
      </td> 
     </tr> 
     <tr> 
      <td colspan="2" class="footer"> 
       <b>Website footer</b> 
      </td> 
     </tr> 
    </table> 
</body> 
</html> 

は、私がここで間違って何をやっている

angular.module('AngularJS', ['ngRoute']); 

Index.js

angular.module('AngularJS') 
    .config(function ($routeProvider) { 
     $routeProvider 
      .when('/Home', { 
       templateUrl: 'Templates/Home.html', 
       controller: 'HomeController' 
      }) 
      .when('/Courses', { 
       templateUrl: 'Templates/Courses.html', 
       controller: 'CoursesController' 
      }); 
    }) 
    .controller('HomeController', function ($scope) { 
     $scope.title = 'Home page'; 
    }) 
    .controller('CoursesController', function ($scope) { 
     $scope.Courses = [ 
      'C', 'C++', 'C#', 'SQL Server', 'AngularJS', 'ASP.NET MVC' 
     ]; 
    }); 

をapp.js ?前もって感謝します。あなたのhref使用で

+0

は、角やangularjsということですか?この質問はもっと混乱することはありません –

+0

それはAngularJSです...ごめんなさい –

+0

あなたはエラーメッセージを表示できます – Vinoth

答えて

1

あなたのコードはうまくいくはずです。正しいangular.jsとangular-route.jsの参照が追加されているかどうか確認してください。

テンプレートのパスも確認してください。ここで

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.10/angular.min.js"></script> 
    <script src="https://code.angularjs.org/1.2.0rc1/angular-route.js"></script> 

は作業DEMO

+0

もし彼がそれを見逃したら、それは常にエラーを表示します – JkAlombro

+0

はい、彼は情報を表示するためにテンプレートに式を追加していないと思います – Sajeetharan

+0

ビンゴ.. AngularJSのCDNリンクを追加しました私は静的リファレンスが間違っているかどうかわかりません静的リファレンスはこれ以外のアプリケーション全体で動作しています –

0

あなただけの1つのスラッシュを逃した

<td class="leftMenu"> 
    <a href="/#/Home">Home</a> 
    <a href="/#/Courses">Courses</a> 
</td> 

このコード。

+1

スラッシュを1つ追加すると、IISのエラーページが表示されます。 –

+0

答えがありません – Sajeetharan

+0

「もし」と言えば、まだ試してみませんでしたか?私には1つの問題ではない – JkAlombro

関連する問題