Suggestion: Play with CSS pointer events could allow for directive to be triggered by inner elements

[bonatoc]

Here's a Codepen based on your original codepen, that describes how you can use CSS pointer-events to make the flip triggered by children elements instead of the element itself.
http://codepen.io/bonatoc/pen/XXXwQq

The pen is self-explanatory, it only consists of children containers with pointer-events:auto, and a pointer-events:none; override on the element.

I think it's interesting to be able to trigger a function while not flipping the main container, because it could be combined with ui-router and load a 3rd, a 4th (etc) view before the flip happens.

In a multi-step form, you expect the container to flip only when the 'next' button is pressed. Or upon whatever user interaction.

[bonatoc]

Another interesting approach is this one (not mine): it could be achieved with addClass/removeClass.
http://codepen.io/edeesims/pen/iGDzk

[zwacky]

hey, nifty use of pointer-events. although this seems to satisfy a very specific use-case and i'd like to leave that out for the time being.