0

我正在尝试使用 angular ng-repeat 创建一个下拉菜单。我有一个 jd 对象,其中包含一个名为 parent_id 的字段,该字段指示该节点应显示在其下的父节点。我需要的帮助是根据以前过滤的数据创建过滤器,如标记中所示

我的标记代码:

<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>

注意事项的变化:

  • 您想过滤父项的 id,而不是当前项的 parentId。

  • 您不需要 {{ }} 围绕过滤器值,因为这被解释为代码,而不是模板。

于 2013-06-25T01:32:58.560 回答