title: Angular - Event for ng-hide and ng-show
body: <p>I'd like to watch my hide and show expressions on all elements in my app.</p>
  
  <p>I know I can do it by wrapping the show directive with a function which just returns the argument:</p>
  
  <pre><code>&lt;div ng-show="catchShow(myShowExpr == 42)"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>However, I'd like to watch all hide/shows across all inputs in my app and the above isn't good enough.</p>
  
  <p>I could also overload the <code>ngShow</code> / <code>ngHide</code> directives though I'd need to reevaluate the expression.</p>
  
  <p>I could also just modify the source since it's quite simple:</p>
  
  <pre><code>var ngShowDirective = ['$animator', function($animator) {
    return function(scope, element, attr) {
      var animate = $animator(scope, attr);
      scope.$watch(attr.ngShow, function ngShowWatchAction(value) {
        var fn = toBoolean(value) ? 'show' : 'hide';
        animate[fn](element);
        //I could add this:
        element.trigger(fn);
      });
    };
  }];
  </code></pre>
  
  <p>Though then I couldn't use the Google CDN...</p>
  
  <p>Is there a nicer way anyone can think of to do this ?</p>