angular.module('plunker', ['ui.bootstrap']);
function AccordionDemoCtrl($scope) {
$scope.animals = {vertibrates:
{mammals: ['lion', 'dog'],
birds: ['hawk', 'sparrow']},
invertibrates: {'insects': ['bee', 'ant']}};
}
<!doctype html>
<html ng-app="plunker">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.js"></script>
<script src="http://angular-ui.github.com/bootstrap/ui-bootstrap-tpls-0.3.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="AccordionDemoCtrl">
<div accordion ng-repeat="(phylum, phylum_examples) in animals">
<div accordion-group class="accord" heading="{{phylum}}">
<div accordion ng-repeat="(class, class_examples) in phylum_examples">
<div accordion-group class="accord" heading="{{class}}">
<div accordion ng-repeat="animal in class_examples">
<div accordion-group class="accord" heading="{{animal}}">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>