0

angular ng-repeat を使用してドロップダウン メニューを作成しようとしています。このノードが表示される親ノードを示すparent_idというフィールドを持つjdオブジェクトがあります。必要なヘルプは、マークアップに示されているように、以前にフィルター処理されたデータに基づいてフィルターを作成することです

私のマークアップコード:

<div >
    <ul class="nav nav-pills" data-ng-controller= "MenuController" >
        <li data-ng-class="{'active':getClass('/customers')}"
            data-ng-repeat="menuItem in menuItems | filter: { ParentId: '0' }" >
            <a href="#/customers"> {{ menuItem.Name }}    </a>
            **<ul>
                <li data-ng-repeat="menuItem1 in menuItems | filter: { ParentId: {{ menuItem1.ParentId }}  }">
                    {{ menuItem1.Name }}
                </li>
            </ul>**
        </li>
    </ul>
</div>

私のサービス:

app.service('menuService', function () {
this.getMenuItems = function () {
    return  menuItems;
};
var menuItems = [
    {
        id: 'ABCDFER1', Name: 'Apperal', ParentId: 0, description: 'Beautifull Apparels'
    },
    {
        id: 'ABCDFER2', Name: 'Electronics', ParentId: 0, description: 'Electronic bargains'
    },
    {
        id: 'ABCDFER3', Name: 'Home & Kitchen', ParentId: 0, description: 'For your kitchen'
    },
    {
        id: 'ABCDFER4', Name: 'Services', ParentId: 0, description: 'Services for you'
    },
    {
        id: 'ABCDFER5', Name: 'Men', ParentId: 'ABCDFER1', description: 'Men Apperal'
    },
    {
        id: 'ABCDFER6', Name: 'Women', ParentId: 'ABCDFER1', description: 'Women Apperal'
    }
];

私のコントローラー：

$scope.menuItems = menuService.getMenuItems();
4

1 に答える 1

1

あなたが達成しようとしていることを私が正しく理解していれば、あなたはこれを望んでいると思います：

<div >
    <ul class="nav nav-pills" data-ng-controller= "MenuController" >
        <li data-ng-class="{'active':getClass('/customers')}"
            data-ng-repeat="menuItem in menuItems | filter: { ParentId: '0' }" >
            <a href="#/customers"> {{ menuItem.Name }} </a>
            <ul>
                <li data-ng-repeat="menuItem1 in menuItems | filter: { ParentId: menuItem.id }">
                    {{ menuItem1.Name }}
                </li>
            </ul>
        </li>
    </ul>
</div>

注意事項の変更:

  • 現在のアイテムのparentIdではなく、親アイテムのIDでフィルタリングしたい。

  • これはテンプレートではなくコードとして解釈されるため、フィルター値を {{ }} で囲む必要はありません。

于 2013-06-25T01:32:58.560 に答える