HTML
<div ng-repeat="(key, value) in FriendsDetail| groupBy: 'UserDivision'">
<ion-item class="item-stable" ng-click="toggleGroup(key)"
ng-class="{active: isGroupShown(key)}">
<i class="icon" ng-class="isGroupShown(key) ? 'ion-minus' : 'ion-plus'"></i>
<span style="margin:5px;color: #7fa42d;font-weight: bold;">{{key=='2'?'Common Programs and Services ':key=='3'?'Common Friends ':key=='4'?'Common Health Interests ':''}}</span>
</ion-item>
<ion-item class="item-accordion"
ng-repeat="friend in value" ng-if="friend.Names" ng-show="isGroupShown(key)">
{{friend.Names}}
</ion-item>
</div>
Controller
$scope.toggleGroup = function (group) {
if ($scope.isGroupShown(group)) {
$scope.shownGroup = null;
} else {
$scope.shownGroup = group;
}
};
$scope.isGroupShown = function (group) {
return $scope.shownGroup === group;
};
<div ng-repeat="(key, value) in FriendsDetail| groupBy: 'UserDivision'">
<ion-item class="item-stable" ng-click="toggleGroup(key)"
ng-class="{active: isGroupShown(key)}">
<i class="icon" ng-class="isGroupShown(key) ? 'ion-minus' : 'ion-plus'"></i>
<span style="margin:5px;color: #7fa42d;font-weight: bold;">{{key=='2'?'Common Programs and Services ':key=='3'?'Common Friends ':key=='4'?'Common Health Interests ':''}}</span>
</ion-item>
<ion-item class="item-accordion"
ng-repeat="friend in value" ng-if="friend.Names" ng-show="isGroupShown(key)">
{{friend.Names}}
</ion-item>
</div>
Controller
$scope.toggleGroup = function (group) {
if ($scope.isGroupShown(group)) {
$scope.shownGroup = null;
} else {
$scope.shownGroup = group;
}
};
$scope.isGroupShown = function (group) {
return $scope.shownGroup === group;
};

