angular UI Router - 何时使用抽象模式/嵌套/命名视图?

时间:2013-11-18 22:42:49

标签: angularjs angular-ui-router

无法从文档中找到这个:

我的用例:一个大型SPA,页面上有多个“小部件”或“应用程序” - 每个都有一个控制器,数据和模板。优选地,每个都应该是一个视图。目前每个模板都加载了ng-include这既烦人又不分离兴趣而且效果不好,因为视图控制器可能在主ctrl被解析之前被初始化 - 这就是我们切换到UI路由器的原因。 url未嵌套的时间 - 例如/page url可以包含Listview,用户视图等。

我想将此移至UI路由器(在我已将现有路由移至UI路由器并检查一切正常后)并且我不确定撰写的正确方法是什么小部件/视图在一起。我应该使用一个抽象视图来保存/page模板(并包含路由)并将每个小部件设置为此抽象中的视图吗?或者没有摘要它会工作吗?我应该使用命名还是嵌套(在某处看到命名视图被认为是代码味道,不知道为什么)。在选项之间进行选择以及设置此选项的最佳实践是什么?我很乐意为此提出任何建议。

谢谢!

2 个答案:

答案 0 :(得分:1)

如果您想要预先设置'抽象状态很有用。在一些儿童州的网址/州,我不认为这是你的最佳选择。使用点分隔状态,例如页面 page.subpage 。我认为会对你有用。一个好的做法是在模块配置的状态内设置控制器,模板和解析,这样您就可以将状态用作将模型链接到视图的单个代码段。 请查看Wiki中ui-router的文档以便更好地理解。

答案 1 :(得分:0)

如果您想拥有一个共同的父视图(例如,带有管理栏的视图),您可以使用抽象状态。这个

如果需要使用公共视图对路由进行分组,则必须使用抽象状态。例如,如果您想要一个 / admin 路由,其中​​所有视图都具有相同的导航栏,那么您可以创建抽象状态 admin ,因为您希望他们的孩子分享他们的导航栏,但您不希望用户可以访问单个 / admin 路由。但是,如果您希望 / admin 路由可以访问,则不需要将状态设置为抽象(在本例中为 ui-view 父状态内的指令不显示任何内容。

来自docs的一些摘要。抽象状态对以下内容有用:

  • 为所有子状态网址添加网址。
  • 插入一个模板,该模板具有自己的子视图将填充的ui-view。
  • 将$ scope对象继承到子目录。