How to bind custom events in AngularJS?

Question

I have an custom event core-transitionend (actually fired by Polymer), and I can set an event handler using document.addEventListener(). But what's the best practice to do it in AngularJS?

Or, I can explicitly set a handler in DOM, i.e. <paper-ripple on-core-transitionend="enter()"></paper-ripple>, but how to define this function in AngularJS?

Answer 1

see this fiddle, here I have created a custom directive which binds the event to the element,

angular.module('HelloApp', [])
    .directive('customDir', function () {
        return {
            restrict: 'A',

            link: function(scope, element, attrs)      
            {
                element.bind("click",function()
            {
            alert("you clicked me");

        })
            }    


        }
    })

In your case you can simply bind your defined event to the element