我需要并行使用两个状态,一个用于我的页面,另一个用于具有多个子状态的模态。 现在调用模态状态会在页面状态发生变化后消除我的页面。
创建我的页面的子状态子项不会是一个解决方案,因为模式将在多个页面上使用。
示例:
$stateProvider
.state('user', {}) // page
.state('bookshelf', {}) // page
.state('books', {}) // modal
.state('books.read', {}) // sub state of modal
因此,如果我在user
并打开我的模态,那么状态将更改为books
,我的模态将具有内容,但页面内容将被删除。
我该如何解决?
答案 0 :(得分:26)
我相信您目前无法使用UI.Router实现此目的。您所描述的是模态组件(理想情况下,它将被写为指令),它独立于主状态跟踪它的状态。
考虑它的方法是UI.Router通过创建状态树来工作。在任何给定时间,您只能看到树的一个分支。你可以深入到一个分支(即book
,book.open
,book.open.checked
),但你不能同时在两个地方。
上述问题的另一个问题是如何将两个不同树的状态序列化为一个网址?它并不是说它无法完成,它只是一个难以解决的问题。
查看这些问题:
同样检查这些回购,他们可能会更进一步解决问题。
至于解决您当前的问题,我认为最简单的问题是'方法是在状态配置中控制模态的状态。
相反,我会添加某种根或抽象状态,然后跟踪模态是否在那里打开。然后,您可以使用shown here之类的事件在控制器之间进行通信。注意:有performance implications听$rootScope
,所以请务必研究这些内容。但是(有人可以随意纠正我),这里的实现并没有出现这些问题,因为AppCtrl
永远不会被破坏。
原来这是一个非常流行的用例,UI路由器的核心贡献者之一维护了一个名为UI Router Extras的插件/添加
它还包括延迟加载的实用程序,名为" Future States"这是非常有帮助的。
话虽这么说,我希望有时间工作的一个功能是维护URL(或者可能是本地存储)中的所有状态,并允许可重用的状态"组件"。后者也在UI路由器路线图中。