我对html5Mode有问题。在我的MVC项目中，我只有一个控制器
public class HomeController : Controller
{
public ActionResult Index()
{
return this.File("index.html", "text/html");
}
}
在我的有角度的项目中，我有两条路线和一个摘要。
angular.module('app').config(function ($urlRouterProvider, $stateProvider, $locationProvider) {
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/app/articles');
$stateProvider
.state('app', {
url: "/app",
abstract: true,
templateUrl: "templates/blocks/layout.html",
controller: 'AppCtrl'
})
.state('app.articles', {
url: "/articles",
templateUrl: 'templates/articles.html',
controller: 'ArticlesCtrl'
})
.state('app.one-article', {
url: "/articles/:articleId",
templateUrl: 'templates/one-article.html',
controller: 'OneArticleCtrl'
});
// use the HTML5 History API
$locationProvider.html5Mode(true).hashPrefix('!');
});
这在RouteConfig.cs中
public static void RegisterRoutes(RouteCollection routes)
{
routes.MapRoute(
name: "articles",
url: "app/articles",
defaults: new { controller = "Home", action = "Index" });
routes.MapRoute(
name: "Default",
url: "{*url}",
defaults: new { controller = "Home", action = "Index" });
}
当我从根目录导航时，一切正常。但是当我单击刷新按钮时，不会加载抽象状态。请帮助我解决该问题。
谢谢
我解决了问题。
我的索引文件在解决方案的根目录中。取而代之的是，我删除了index.html文件，并创建了MVC视图Views-> Home-> Index.cshtml。所有HTML与index.html中的相同。
现在从我正在使用的控制器中
public ActionResult Index()
{
return this.View();
}
代替此：
public ActionResult Index()
{
return this.File("index.html", "text/html");
}
这是我的RouteConfig.cs
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
name: "AngularCatchAllRoute",
url: "{*any}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}
希望有人会发现这篇文章有用。
波格丹
[使用最新角度和$locationProvider.html5Mode()设置，我们可以选择其中任何一个>]
1）提供<base href="
$locationProvider.html5Mode(setting)模式。 我创建了working plunker，该文件的标题中包含以下特殊行：
<!DOCTYPE html> <html ng-app="MyApp"> <head> <title>My App</title> <script> document.write('<base href="'+ document.location.pathname +'" />') </script> </head>在此处检查：$locationProvider
param：
模式 type：（可选）booleanObject
- 如果为布尔值，则将html5Mode.enabled设置为value。
- 如果对象，则设置为启用，requireBase和rewriteLinks分别为值。支持的属性： -enabled
– {boolean} –（默认值：false）如果为true，则将依靠history.pushState更改支持的网址。将退回到不支持pushState的浏览器中的哈希前缀路径。 -requireBase-{boolean}-（默认：true）启用html5Mode时，指定是否需要存在标签。如果enabled和requireBase为true，并且不存在基本标记，则在注入$ location时将引发错误。有关更多信息，请参见$ location指南。 -rewriteLinks-{boolean}-（默认值：true）启用html5Mode时，启用/禁用相对链接的url重写。