Accordian In Ionic

Controller

//Accordian Start
    $scope.accordian = [
     { title: "CallList", id: 1 },
     { title: "Schedule", id: 2 },
     { title: "CallHistory", id: 3 },
    ];
 
    $scope.toggleAccordian = function (accordian) {
        if ($scope.isAccordianShown(accordian)) {
            $scope.shownaccordian = null;
        } else {
            $scope.shownaccordian = accordian;
        }
    };
    $scope.isAccordianShown = function (accordian) {
        return $scope.shownaccordian === accordian;
    };
    $scope.toggleAccordian('1');

HTML

<div ng-repeat="(key, value) in accordian| groupBy: 'id'">
                <ion-item class="item-stable" ng-click="toggleAccordian(key)"
                          ng-class="{active: isAccordianShown(key)}">
                    <i class="icon" ng-class="isAccordianShown(key) ? 'ion-minus' : 'ion-plus'"></i>
                    &nbsp;
                    <span style="margin:5px;color: #7fa42d;font-weight: bold;">{{key=='1'?'Call List':key=='2'?'Next 7 Days Schedule':key=='3'?'Call History':''}}</span>
                </ion-item> 
                <ion-item class="" ng-repeat="items in value" ng-show="isAccordianShown(key)">                   
                    <div class="col-lg-12" ng-repeat="x in xx" ng-show="key=='1'">                      
                    </div>                   
                    <div class="list" ng-repeat="z in zz" ng-show="key=='2'">                       
                    </div>
                    <div class="col list" ng-show="key=='3'">                       
                    </div>                                      
                </ion-item>
            </div>