基于 URL 路径 + 哈希路径的 Angular ui 路由答案

【问题标题】：Angular ui route based on URL path + hash path基于 URL 路径 + 哈希路径的 Angular ui 路由
【发布时间】：2014-11-17 18:03:59
【问题描述】：

我正在尝试使用 UI 路由器为以下路径显示不同的模板。我正在添加完整的 URL，以便您可以确切地看到意图是什么。

基本上我希望路由器考虑实际的 URL 路径，但现在没有检测到模板，状态提供程序重定向到 /。

http://localhost/dashboard/#home

这就是 $stateProvider 的内容。

.state('dashboard.home', {
   url: '/home',
   path: 'dashboard',
   templateUrl: '/partials/dashboard/home'
})

【问题讨论】：

您是否知道“点表示法”（dashboard.home）用于子状态？意思是，没有我们的“仪表板”状态，你不能注册子状态？
我从未听说过此功能 (path)。你有参考资料吗？
@Asik 即使我简单地把它命名为仪表板，它仍然不起作用。
我猜，dashboard 是你的目录名。index.html 在这个dashboard 文件夹中。所以你应该用“home”注册......而不是“dashboard”

标签： angularjs angular-ui-router

【解决方案1】：

我创建了plunker with example here。一般来说，我们可以有这样的父子：

$stateProvider
  .state('dashboard', {
    template: '<div ui-view=""></div>',
  })
$stateProvider
  .state('dashboard.home', {
    url: '/home2',
    path: 'dashboard',
    templateUrl: '/partials/dashboard/home'
  })

我们可以看到，有一个父状态“dashboard”（在这种情况下没有定义 url）和它的子状态“dashboard.home”，这里的 url 是url: '/home2'。所以去#/home2，我们会到达这个状态

或者我们可以使用这个：

$stateProvider
  .state('dashboard_home', {
    url: '/home',
    templateUrl: '/partials/dashboard/home'
  })

这是没有父母的状态。这就是为什么它不能包含dashboard.，它会被评估为：“find parent with name 'dashboard'”

单击此链接时，这些状态正在起作用：

<a href="#/home">
<a href="#/home2">

查看here

【讨论】：