2014-01-16 135 views
1

我一直在網上搜索解決方案,但找不到任何能夠解決我的問題的解決方案。 我想用AngularJS和MVC做客戶端路由。使用AngularJS和MVC進行路由

這是我使用指導線的Plunker,但它並不能幫助我。我的MVS2項目文件夾結構如下: $ root/Views/Home/Home.html

我得到的錯誤是找不到頁面。我在這裏錯過了什麼?

AngularJS

// create the module and name it myApp 
var myApp= angular.module('myApp', ['ngRoute']); 

// configure our routes 
myApp.config(function ($routeProvider) { 
    $routeProvider.when('/', {templateUrl: 'Home.html',controller: 'mainController'}) 
}); 

// create the controller and inject Angular's $scope 
scotchApp.controller('mainController', function ($scope) { 
// create a message to display in our view 
    $scope.message = 'Home Page should appear here'; 
}); 

HTML文件的訪問

<html data-ng-app="myApp"> 
<head runat="server"> 
    <title> 
     <asp:ContentPlaceHolder ID="TitleContent" runat="server" /> 
    </title> 
</head 
<body data-ng-controller="mainController"> 
    <div id="Div1"> 
     <div data-ng-view></div> 
    </div> 
</body> 
</html> 
+0

您是否嘗試過從瀏覽器請求Home.html以確定它是否真的被服務? – idursun

+0

我已將該網址複製到我的瀏覽器,但沒有找到它。我不知道如何構建我的路由以獲得正確的頁面? – Gericke

回答

4

MVC塊Views文件夾!它將始終返回HTTP狀態404!

爲什麼?這是爲了安全。它阻止訪問者查看您的視圖文件(ascx,cshtml,vbhtml等),這是源代碼。

它是如何做?您會注意到Views文件夾有一個web.configWeb.config配置爲返回404

這裏是web.config

<add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" /> 

通知的代碼段,對於任何路徑和任何HTTP方法,該處理程序是HttpNotFoundHandler

解決方案:不使用您的AngularJS模板的View文件夾或修改web.config需要您自擔風險

+0

感謝您提供這些寶貴的信息,我根本不知道這一點。從你的答案中,我決定走一條不同的路線,並且完美地工作。將現在發佈答案 – Gericke

1

答案是LostInComputers給了我我找到了一個將html頁面注入到我的MVC項目的解決方案。

的.js

var myApp = angular.module('myApp', ['ngRoute']); 

myApp.config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
      templateUrl: '/templates/Home.html', 
      controller: 'mainController' 
     }) 
.when('/about', { 
    templateUrl: '/templates/About.html', 
    controller: 'mainController' 
}) 

$routeProvider.otherwise({ redirectTo: '/' }); 

}); 

我所做的是我的根目錄下創建一個模板文件夾,並在裏面加了我的.html頁面。 這對我來說非常合適。