我是离子的新手,并尝试使用Accordion在我的应用程序中构建多级菜单。当我尝试添加每次点击子类别时关闭的产品时,它从子类别工作正常。
这是我的HTML代码: -
<ion-content class="menu_cont"> <ion-list>
<div ng-repeat="list in wholecatagoryList">
<ion-item class="item-stable" ng-click="toggleGroup(list)"
ng-class="{active: isGroupShown(list)}"> <i class="icon"
ng-class="isGroupShown(list) ? 'ion-minus' : 'ion-plus'"></i>
{{list.title}} </ion-item>
<ion-item class="item-accordion"
ng-repeat="subcatagorylist in list.children"
ng-show="isGroupShown(list)" ng-click="toggleGroup(subcatagorylist)"
ng-class="{active: isGroupShown(subcatagorylist)}"> <i
class="icon"
ng-class="isGroupShown(subcatagorylist) ? 'ion-minus' : 'ion-plus'"></i>
{{subcatagorylist.title}}
<ion-item class="item-accordion"
ng-repeat="Productlist in subcatagorylist.children"
ng-show="isGroupShown(subcatagorylist)">
{{Productlist.title}} </ion-item>
</ion-item>
</div>
</ion-list> </ion-content>
这是我的json回复: -
[
{
"id": "165",
"title": "Women's Fashion",
"url": "womens-fashion",
"children": [
{
"id": "176",
"title": "Women's Aparel",
"url": "women-s-aparel",
"children": [
{
"id": "221",
"title": "Formal",
"url": "formal"
},
{
"id": "222",
"title": "Casual",
"url": "casual"
},
{
"id": "223",
"title": "Traditional",
"url": "traditional"
},
{
"id": "224",
"title": "Nightwears",
"url": "nightwears"
},
{
"id": "225",
"title": "Winter wears",
"url": "winter-wears"
},
{
"id": "240",
"title": "Party Wear",
"url": "party-wear"
}
]
}
这是我的toggelGroup代码: -
$scope.wholecatagoryList = [];
if (response.data.length > 0) {
$scope.wholecatagoryList = response.data;
}
$scope.toggleGroup = function(group) {
if ($scope.isGroupShown(group)) {
$scope.shownGroup = null;
} else {
$scope.shownGroup = group;
}
};
$scope.isGroupShown = function(group) {
return $scope.shownGroup === group;
};
任何帮助将不胜感激。
由于