angularjs - UI-Router 隐藏父模板

Question

假设一个名为 的状态项目.new 哪里新品 是 的嵌套状态项目 .
有没有办法隐藏父模板以仅显示子模板？

Answer 1

有两种方法可以解决这个问题。

按名称处理 ui View

您可以使用命名 View 来声明您的模板应该通过按名称寻址 View 来呈现在正确的“父”ui View 中，如下所示:

https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views

这需要提供命名 ui-view元素或通过引用已知的祖父状态来解决它们。

使用不同的状态层次结构

另一种选择是不让这些状态相互继承(或者至少让 .new 不是 projects 列表状态的子状态。通过在名称中使用点，您可以在点。所以有几个选项:

调用各州 projects和 projects_new使它们出现在同一级别，从而不尝试渲染 new部分进入列表模板。 (我不太喜欢这种方法，因为这些州之间有一些共同点)

引入一个抽象状态并将当前的“项目列表”状态移到这个状态下，这样你就有 projects带有两个子状态的抽象 projects.list和 projects.new哪里projects.list只使用父状态的 url。有关详细信息，请查看 https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#abstract-state-usage-examples 中的优秀文档。