Angular $stateProvider - 不匹配路由或“空白”路由

Posted 2023-02-22

【中文标题】Angular $stateProvider - 不匹配路由或“空白”路由

【英文标题】：Angular $stateProvider - match no route or 'blank' route

【发布时间】：2017-11-06 21:48:22

【问题描述】：

我使用 $stateProvider 的角度如下：

var stateConfig = function ($stateProvider, $urlRouterProvider) 

    // Redirect if no route
    $urlRouterProvider.otherwise("");

    $stateProvider.state("home.myState", 
        url: "",
        templateUrl: "/mytemplate.html",
        controller: "MyController"
    );
;

... 这适用于这样的 .NET MVC url（没有定义角度路由）：

http://hostname/MvcController/id

问题是有时 URL 会采用这种形式：

http://hostname/MvcController/id#/

...我可以像这样更改我的状态定义：

    $stateProvider.state("home.myState", 
        url: "/",
        ...

，它与新 URL 匹配，但不再与原始 URL 匹配（没有结尾的 '#/'）。我应该如何定义状态，或配置我的路由，以便它匹配一个可以具有“空白”路由（即带有尾随 '#/'）或根本没有定义路由（没有尾随 '#/ ')

【参考方案1】：

据我所知，您需要在 app.config 中打开 HTML5 模式：

app.config(["$locationProvider", function($locationProvider) 
   $locationProvider.html5Mode(true);
]);

您还必须在标签中设置一个基本网址：

< base href="/" >

【参考方案2】：

我需要更改为这个，当没有提供路由时将路由设置为具有“/”（然后状态匹配以“/”为后缀的路由）

$urlRouterProvider.otherwise("/");

$stateProvider.state("home.myState", 
    url: "/",
    ...