我开始玩 Jade,我遇到了这个奇怪的问题。我敢肯定这是愚蠢的,但我已经尝试了一个小时没有成功。
我有一个包含组的对象,每个组都包含项目。因此,一个ng-repeat
嵌套在另一个内部。
ul.page-sidebar-menu(ng-repeat="group in menuItems")
li(ng-class="group.groupStyle")
a(href="{{group.target}}")
i(ng-class="group.iconStyle")
span.title {{group.name}}
span(ng-class="group.spanStyle")
ul.sub-menu(ng-repeat="item in group.items")
li
a(href="{{item.target}}") {{item.name}}
对象来源是这样的:
[
{
name: "Inicio",
target: "/",
groupStyle: {
start: "start",
active: "active"
},
spanStyle: {
selected: "selected"
},
iconStyle: "icon-home"
},
{
name: "Catalogo",
target: "javascript:;",
groupStyle: { },
spanStyle: {
arrow: "arrow"
},
iconStyle: "icon-book",
items: [
{ name: "Clientes", target: "view1" },
{ name: "Rutas", target: "view1" },
{ name: "Transportistas", target: "view1" }
]
},
{
name: "Panel de Control",
target: "javascript:;",
groupStyle: { },
spanStyle: {
arrow: "arrow"
},
iconStyle: "icon-cogs",
items: [
{ name: "Usuarios", target: "view2" },
{ name: "Configuracion", target: "view2" }
]
}
]
因此,理论上每个组都有一定数量的项目,并且应该可以嵌套。有趣的部分来了:当 Jade 基于列表呈现 HTML 时,它只呈现每个组的第一个孩子。这是输出:
但是当我在另一个 ng-repeat 列表之前添加一个表时,它工作正常。编码:
ul.page-sidebar-menu(ng-repeat="group in menuItems")
li(ng-class="group.groupStyle")
a(href="{{group.target}}")
i(ng-class="group.iconStyle")
span.title {{group.name}}
span(ng-class="group.spanStyle")
table
tr(ng-repeat="item in group.items")
td {{item.name}}
ul.sub-menu(ng-repeat="item in group.items")
li
a(href="{{item.target}}") {{item.name}}
和输出:
所以,请有更多咖啡或更多翡翠技能的人帮我一把。我敢肯定它一定是显而易见的。
提前致谢。