AngularJS Example:
by Anov Siradj
HTML
<div ng-app="myApp" ng-controller="MainController">
<input type="button" ng-click="toggle()" value="Toggle">
<div class="div1" toggle>
<p>This is section #1</p>
</div>
</div>
CSS
</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ -->
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
<style>
.div1 {
background: Brown;
width: 200px;
height: 200px;
text-align: center;
}
.div1 p {
position: relative;
top: 50%;
}
JavaScript
angular.module("myApp", []) //
.controller('MainController', function($scope) {
$scope.toggle = function() {
$scope.$broadcast('event:toggle');
}
}) //
.directive('toggle', function() {
return function(scope, elem, attrs) {
scope.$on('event:toggle', function() {
elem.slideToggle();
});
};
});