404将asp.net mvc app转换为angularjs时

so I have my full asp.net mvc project working which renders perfectly fine.

所以我有完整的asp.net mvc项目工作,这完全没问题。

Then I am trying to convert it to use angular for the UI and web api for the backend.

然后我试图将其转换为使用角度为UI和web api为后端。

In the views folder I added an index.html file with this code:

在views文件夹中,我添加了一个带有以下代码的index.html文件:

<!--
* INSPINIA - Responsive Admin Theme
* Version 2.0
*
-->

<!DOCTYPE html>
<html ng-app="inspinia">
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Page title set in pageTitle directive -->
    <title page-title></title>

    <!-- Font awesome -->
    <link href="~/fonts/font-awesome/css/font-awesome.min.css" rel="stylesheet">

    <!-- Bootstrap -->
    <link href="~/Content/bootstrap.min.css" rel="stylesheet">

    <!-- Main Inspinia CSS files -->
    <link href="~/Content/animate.css" rel="stylesheet">
    <link id="loadBefore" href="~/Content/style.css" rel="stylesheet">


</head>

<!-- ControllerAs syntax -->
<!-- Main controller with serveral data used in Inspinia theme on diferent view -->
<body ng-controller="MainCtrl as main">

    <!-- Main view  -->
    <div ui-view></div>

    <!-- jQuery and Bootstrap -->
    <script src="~/Scripts/jquery-2.1.1.min.js"></script>
    <script src="~/Scripts/plugins/jquery-ui/jquery-ui.js"></script>
    <script src="~/Scripts/bootstrap/bootstrap.min.js"></script>

    <!-- MetsiMenu -->
    <script src="~/Scripts/plugins/metisMenu/jquery.metisMenu.js"></script>

    <!-- SlimScroll -->
    <script src="~/Scripts/plugins/slimscroll/jquery.slimscroll.min.js"></script>

    <!-- Peace JS -->
    <script src="~/Scripts/plugins/pace/pace.min.js"></script>

    <!-- Custom and plugin javascript -->
    <script src="~/Scripts/app/inspinia.js"></script>

    <!-- Main Angular scripts-->
    <script src="~/Scripts/angular/angular.min.js"></script>
    <script src="~/Scripts/plugins/oclazyload/dist/ocLazyLoad.min.js"></script>
    <script src="~/Scripts/angular-translate/angular-translate.min.js"></script>
    <script src="~/Scripts/ui-router/angular-ui-router.min.js"></script>
    <script src="~/Scripts/bootstrap/ui-bootstrap-tpls-0.12.0.min.js"></script>
    <script src="~/Scripts/plugins/angular-idle/angular-idle.js"></script>

    <!--
     You need to include this script on any page that has a Google Map.
     When using Google Maps on your own site you MUST signup for your own API key at:
     https://developers.google.com/maps/documentation/javascript/tutorial#api_key
     After your sign up replace the key in the URL below..
    -->
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDQTpXj82d8UpCi97wzo_nKXL7nYrd4G70"></script>

    <!-- Anglar App Script -->
    <script src="~/Scripts/app.js"></script>
    <script src="~/Scripts/config.js"></script>
    <script src="~/Scripts/translations.js"></script>
    <script src="~/Scripts/directives.js"></script>
    <script src="~/Scripts/controllers.js"></script>

</body>
</html>

However I get a 404 when I try to browse to /views/index.html

但是当我尝试浏览/views/index.html时,我得到了404

So I suppose MVC restricts in some way to see html files on this folder. Whats the solution here?

所以我想MVC以某种方式限制在这个文件夹上查看html文件。这是什么解决方案?

1 个解决方案

#1

MVC pattern means the controller takes requests and renders views. You are trying to bypass that and the Views/web.config prevents that.

MVC模式意味着控制器接收请求并呈现视图。您试图绕过它,而Views / web.config阻止了这一点。

You can either

你也可以

render your view via the Controller (MVC-style), or configure a

通过Controller(MVC风格)渲染视图,或配置

section of your app to serve static files

您的应用程序部分用于提供静态文件

#1