[英]How does AngularJs .Config works?
我正在嘗試創建一個導航欄,這就是我的html代碼看起來像......
<div class="container">
<div class="row">
<div class="navbar navbar-default">
<div class="navbar-header">
<ul class="nav navbar-nav">
<li><span class="navbar-brand">Registration</span></li>
</ul>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/Courses">Courses</a></li>
<li><a href="/Instructors">Instructors</a></li>
</ul>
</div>
</div>
<div ng-view></div>
</div>
</div>
我在我的布局頁面中放了'ng-app'標簽.............我的問題是當我點擊這兩個導航按鈕時,它會給我一個錯誤頁面,說找不到頁面(404錯誤代碼).........這就是我的模塊的樣子.............
var registrationModule = angular.module("registrationModule", [])
.config(function ($routeProvider, $locationProvider) {
$routeProvider.when('/Courses', { templateUrl: '/Templates/Course.cshtml', controller: 'CoursesController' });
$routeProvider.when('/Instructors', { templateUrl: '/Templates/Instructor.cshtml', controller: 'InstructorsController' });
$locationProvider.html5Mode(true);
})
;
這些是我創建的兩個模板.......... 1. Course.cshtml:
<div class="row">
<h2>Course</h2>
<div class="span10">
<table class="table table-condensed table-hover">
<tr>
<th>Course</th>
<th>Course Name</th>
<th>Instructor</th>
</tr>
<tr ng-repeat="course in courses">
<td>{{course.number}}</td>
<td>{{course.name}}</td>
<td>{{course.instructor}}</td>
</tr>
</table>
</div>
</div>
2.Instructor.cshtml:
<div class="row">
<h2>Instructor</h2>
<div class="span10">
<table class="table table-condensed table-hover">
<tr>
<th>Room Number</th>
<th>Instructor's Name</th>
<th>Email</th>
</tr>
<tr ng-repeat="instructor in instructors">
<td>{{instructor.roomNumber}}</td>
<td>{{instructor.name}}</td>
<td>{{instructor.email}}</td>
</tr>
</table>
</div>
</div>
你不能通過url訪問cshtml文件,因為它們只是分析了C#
razor引擎,我寧願你從控制器動作加載那些.cshtml文件。 而不是使用asp.net mvc控制器動作加載它的cshtml
指令路徑。
碼
var registrationModule = angular.module("registrationModule", [])
.config(function($routeProvider, $locationProvider) {
$routeProvider.when('/Courses', {
//templates controller Course action will return Course.cshtml
templateUrl: '/Templates/Course',
controller: 'CoursesController'
});
$routeProvider.when('/Instructors', {
//templates controller Instructor action will return Instructor.cshtml
templateUrl: '/Templates/Instructor',
controller: 'InstructorsController'
});
$locationProvider.html5Mode(true);
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.