angularjs - 使用 angularjs 的嵌套选项卡

Question

需要创建嵌套选项卡。

在一个页面中会有多个 Person id 选项卡作为外部选项卡，单击每个选项卡将打开内部选项卡，如主页、办公室等，单击内部选项卡 - 主页时，将显示选项卡内容。

外表:人 1 人 2

Innertab:家庭办公室

引用网站 - http://angular-ui.github.io/bootstrap/ ，创建带有内容的外部选项卡。创建了 2 个单独的标签集，但无法在两个标签集之间提供链接。

有人可以帮助我如何为嵌套选项卡编写指令吗？有引用链接吗？

Answer 1

我相信AngularUI Router就是你要找的。 UI-Router 的大部分功能在于它嵌套状态和 View 的能力。按照我提供的链接查看 Nested States & Views 部分.

此 Plunker example包含 AngularUI Router实现您正在寻找的类似功能。

[编辑]

这种由嵌套 View 组成的布局正是 AngularUI Router 的样子。是用来:



所以TabsTemplate将动态呈现第一级选项卡(任意数字)。
TabTemplate可以是没有任何动态内容的模板，因为家庭和办公室选项卡始终存在。
OfficeTemplate和 HomeTemplate再次是根据当前人员的选择动态填充的模板。