AngularJS路由是否支持“breadcrumb views”?

时间:2015-08-27 15:14:54

标签: angularjs routing navigation angular-ui-router

我不知道这种路由/导航风格是否有名称,但play.spotify.com就是一个很好的例子。简而言之,在每个导航决策时,网站都会加载新视图而不删除旧视图。这样可以获得令人满意的“视觉面包屑”,从而增强单页应用程序的连续性。

关键功能:

  • 网址仅反映 当前状态,因此重新加载(或链接共享)会删除此历史记录。
  • 历史长度(看似)是任意的 - 这不是分层树状导航,而是图形上的一条路径。

play.spotify.com

我的问题是

  • 是否有一种路由方案(通过ui-router或其他方式)可以在Angular中实现这一点?
  • 这有名字吗?

实现这一点的唯一方法我可以看到,在“Angular - UI Router - programmatically add states”中以ui-router方式添加状态,但它看起来非常h​​acky。

1 个答案:

答案 0 :(得分:0)

我不确定这是否有名字,如果它有我从未遇到它。上面视频中的行为可以通过使用包含路线更改时不会改变的侧边栏的布局来实现。

正在更改的部分都位于中心,因此基于窗口小部件的方法会在页面上放置页眉,页脚和侧栏。然后,当<div ui-view></div>位于主页的中间时,只有当您选择新路线时,此内容才会更改

我希望这会有所帮助