Skip to content

Instantly share code, notes, and snippets.

@anonymoussc
Created October 25, 2015 16:11
Creating a Custom Event Directive
<!DOCTYPE html>
<html ng-app="exampleApp">
<head>
<title>Directives</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<script>
angular.module("exampleApp", [])
.controller("defaultCtrl", function($scope, $location) {
$scope.message = "Tap Me!";
}).directive("tap", function() {
return function(scope, elem, attrs) {
elem.on("touchstart touchend", function() {
scope.$apply(attrs["tap"]);
});
}
});
</script>
</head>
<body>
<div id="todoPanel" class="panel" ng-controller="defaultCtrl">
<div class="well" tap="message = 'Tapped!'">
{{message}}
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment