Skip to content

Instantly share code, notes, and snippets.

@karkranikhil

karkranikhil/htmlfile collapsible

Created August 5, 2015 10:23
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save karkranikhil/0a2c121953d08c02a7fb to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save karkranikhil/0a2c121953d08c02a7fb to your computer and use it in GitHub Desktop.
Download ZIP
Raw
htmlfile collapsible
<!doctype html>
<html ng-app="plunker">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.js"></script>
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="AccordionDemoCtrl">
<accordion>
<accordion-group is-open="status.open" ng-repeat="item in items">
<accordion-heading>
<i class="glyphicon" ng-class="{'glyphicon-chevron-down': status.open, 'glyphicon-chevron-right': !status.open}"></i>{{item.name}}
</accordion-heading>
<div>
<accordion>
<accordion-group is-open="status.close">
<accordion-heading>
<i class="glyphicon" ng-class="{'glyphicon-chevron-down': status.close, 'glyphicon-chevron-right': !status.close}"></i>{{item.name}}
</accordion-heading>
<div>
</div>
</accordion-group>
</accordion>
</div>
</accordion-group>
</accordion>
</div>
</body>
</html>
Raw
jsfile
angular.module('plunker', ['ui.bootstrap'])
// Make sure you inject $sce in your controller.
// $sce is part of angular, so no need to include ngSanitize.
.controller('AccordionDemoCtrl', ['$scope', function($scope) {
$scope.items = [{"name":"a"},{"name":"b"}];
}]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment