i'm new in angularjs , i'm trying write directives works on events 'blur'. i'm confused back-end process of event-directive. how work? there numerous directives 'ngclick' or 'nghover' , pass method want execute on event directives. this:
<div ng-click="dosomethingonclick()"></div> and define 'dosomethingonclick()' method in our controller. want know how 'ngclick' directive executes method on event happen. if can explain code, great.
thanks in advance.
here's definition of ng-click pulled 1.1.5 source added comments throughout code explain each line far understand it.
/** * @ngdoc directive * @name ng.directive:ngclick * * @description * ngclick allows specify custom behavior when * element clicked. * * @element * @param {expression} ngclick {@link guide/expression expression} evaluate upon * click. (event object available `$event`) * * @example <doc:example> <doc:source> <button ng-click="count = count + 1" ng-init="count=0"> increment </button> count: {{count}} </doc:source> <doc:scenario> it('should check ng-click', function() { expect(binding('count')).tobe('0'); element('.doc-example-live :button').click(); expect(binding('count')).tobe('1'); }); </doc:scenario> </doc:example> */ /* * directive allows creation of custom onclick handlers defined angular * expressions , compiled , executed within current scope. * * events handled via these handler configured not propagate further. */ //make object var ngeventdirectives = {}; //for each string in list separated spaces foreach( 'click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter mouseleave'.split(' '), //create function creates directive , called each element in list above function(name) { //directivenormalize things strip -data prefix , deal camel casing conversion var directivename = directivenormalize('ng-' + name); //setting property on ngeventdirectives equal new [] contains dependency injection values , function return directive definion object (or in case link function) $parse service being used ngeventdirectives[directivename] = ['$parse', function($parse) { //link function call each element return function(scope, element, attr) { //$parse value passed in quotes attribute ng-click="something()" fn = something() //my guess parse magic... investigate var fn = $parse(attr[directivename]); //setup regular event listener using bind abstraction addeventlistener/attachevent element.bind(lowercase(name), function(event) { //running function scope.$apply(function() { fn(scope, {$event:event}); }); }); }; }]; } );
Comments
Post a Comment