1

私はジェイドをいじり始めていますが、この奇妙な問題が発生しています。ばかげたことだと思いますが、1時間試してみましたが成功しませんでした。

グループを含むオブジェクトがあり、各グループにはアイテムが含まれています。したがって、一方が他方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}}

そして出力：

欠品なし

だから、体にもっとコーヒーを持っている人か、ジェイドのスキルがもっとある人に手を貸してください。きっとそれは明らかな何かに違いない。

前もって感謝します。

4

1 に答える 1

6

私が推測したように、それはばかげた問題でした。ng-repeat は、リスト レベルではなく、アイテム レベルにする必要があります。これが修正されたコードです。

                ul.page-sidebar-menu
                li(ng-repeat="group in menuItems", 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
                        li(ng-repeat="item in group.items")
                            a(href="{{item.target}}") {{item.name}}
于 2013-10-18T17:10:23.427 に答える