使用URL实现ui-router懒加载状态

Question

我正在尝试使用 ui-router 实现状态的惰性加载，将状态设置委托给我的应用程序的子组件。虽然我已经成功地使用 $state.go 或等价物来实现了惰性加载部分，但我无法通过URL来实现它。

例如，在启动时，我的 app 只会设置以下2个状态：view1 和 view2。当加载 view1 状态时，它就会设置自己的子状态：view1.profile 和 view1.interest。请查看这个来自Gist的示例网站：

http://bl.ocks.org/marcoslin/raw/b59cfa9a9a44bde04f9f/

正如您从上面的示例中看到的那样，View1Profile在启动时不是有效的链接，但是如果您单击它，它将加载view1，然后加载view1profile，生成的URL如下：

http://bl.ocks.org/marcoslin/raw/b59cfa9a9a44bde04f9f/#/view1/profile

然而，如果您单击上面生成的URL，app 将重新加载，并且不再知道 view1profile，并将重定向回 home。有什么建议我可以解决这个问题吗？更具体地说，有没有办法让URL触发 $stateNotFound 事件？

也许答案部分在他们关于 如何：延迟加载状态的神秘文档中。我无法弄清楚以下内容的含义：

• 如何在事件上设置重试承诺
• 如何使用存储的提供程序定义 unfoundState 并解决承诺

- marcoseu

---

Marcos，我很快会发布一些ui-router的扩展，包括FutureStates，即延迟加载状态。目前，我的github仓库只有我的parallel/sticky状态实现，但我计划在本周内添加未来状态（包括通过AngularAMD）。Http://GitHub.com/christopherthielen/ui-router-extras - Chris T

@ChrisT 真是时机恰到好处，因为我也在对angularAMD进行一些增强。如果你需要在angularAMD中添加其他功能，请提出问题。我正在添加一个 angularAMD.config，它将有助于按需创建和设置 $stateProvider。 - marcoseu

马可斯，我已经上传了ui-router-extras的预览版本0.0.1-preview。我将其添加到了bower中，因此你可以从那里获取它，或者直接从我的github存储库中获取它。我尚未为ngload添加测试，因为我需要弄清楚如何进行异步requirejs测试。这是一个预览版本，因此有很多代码需要重新组织和清理。但是，我认为它可能会对你有所帮助。请访问：https://github.com/christopherthielen/ui-router-extras/blob/master/release/ct-ui-router-extras.js - Chris T

Answer 1

Marcos,

请查看http://christopherthielen.github.io/ui-router-extras/example/future/index.html，了解如何将FutureState与AngularAMD集成。

请查看http://christopherthielen.github.io/ui-router-extras/#/future/，获取$futureStateProvider的API和概述。

- Chris T