gpt4 book ai didi

asp.net - Angularjs html5Mode页面刷新打破了asp.net mvc中的路由

转载 作者:行者123 更新时间:2023-12-02 05:41:33 24 4
gpt4 key购买 nike

我在我的 asp.net 应用程序中执行 angularjs 路由。我有一个文件夹名称模板,其中包含 3 个 html 页面主页、关于、错误。这是我的 app.js 文件

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

app.controller('HomeController', function ($scope) {
$scope.Message = "We are in home page";
});
app.controller('AboutController', function ($scope) {
$scope.Message = "We are in about page";
});
app.controller('ErrorController', function ($scope) {
$scope.Message = "404 page not found";
});

app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
redirectTo: function () {
return '/home';
}
}).
when('/home', {
templateUrl: '/template/Home.html',
controller: 'HomeController'
}).
when('/about', {
templateUrl: '/template/About.html',
controller: 'AboutController'
}).
when('/error', {
templateUrl: '/template/Error.html',
controller: 'ErrorController'
}).
otherwise({
redirectTo: '/error'
});
$locationProvider.html5Mode(true);
}]);

Home.html 由

<div ng-controller="HomeController">
<h1>Home Page</h1>
<h3>{{Message}}</h3>

等等。

在我的 Layout.cshtml 文件中,我包含了模块 myApp 和 base 属性。

   <!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<base href="/" />

正文定义了一些链接

<body>
<div>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/erro">Invalid Url</a></li>
</ul>
</div>
<div class="container">
<div data-ng-view="" id="ng-view" class="slide-animation"></div>
</div>

当我从家导航到其他人时,路由工作正常。但是当我刷新页面时,它会出现资源未找到错误。为此,我还在我的 web.config 文件中包含了这样的服务器端重写。

   <rewrite>
<rules>
<rule name="Main Rule" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>

enter image description here

问题仍然需要帮助解决。谢谢。

最佳答案

我已经通过修改 Route.Config 文件解决了这个问题

  routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);

将其替换为

 routes.MapRoute(
name: "Application",
url: "{*url}",
defaults: new { controller = "Home", action = "Index" });

关于asp.net - Angularjs html5Mode页面刷新打破了asp.net mvc中的路由,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30322892/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com