var myApp = angular.module( 'myApp', [] ); myApp.controller( 'MyCtrl', [ '$scope', function ( $scope ) {}]); angular.forEach( [ 'blur', 'focus' ], function ( name ) { var directiveName = 'myng' + name.replace(/^\w/, function( char ) { return char.toUpperCase(); } ); myApp.directive( directiveName, [ '$parse', function ( $parse ) { return function( scope, element, attr ) { var fn = $parse( attr[ directiveName ] ); element.bind( name.toLowerCase(), function ( event ) { scope.$apply( function () { fn( scope, { $event: event } ); }); }); }; }]); }); myApp.directive( 'myngFocused', [ '$compile', function ( $compile ) { return function ( scope, element, attr ) { var scopeVar = attr.myngFocused; attr.$set( 'myngFocused' ); attr.$set( 'myngFocus', scopeVar + ' = true' ); attr.$set( 'myngBlur', scopeVar + ' = false' ); $compile( element )( scope ); }; }]);