404 将 asp.net MVC 应用程序转换为 AngularJS 时

本文关键字：程序转换 AngularJS 应用 MVC asp net | 更新日期: 2023-09-27 17:56:45

所以我有我完整的 asp.net mvc项目工作，渲染非常好。

然后我尝试将其转换为将角度用于 UI 和 Web API 用于后端。

在 views 文件夹中，我添加了一个包含以下代码的索引.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>

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

所以我想 MVC 以某种方式限制查看此文件夹中的 html 文件。这里的解决方案是什么？

404 将 asp.net MVC 应用程序转换为 AngularJS 时

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

你可以

  • 通过控制器（MVC 样式）呈现视图，或配置
  • 部分以提供静态文件
相关文章：