title: angularjs chained fade-in / fade-out transition
body: <p>I have looked at the official show/hide transition example at the bottom of this page... <a href="http://docs.angularjs.org/api/ng.directive:ngShow" rel="noreferrer">http://docs.angularjs.org/api/ng.directive:ngShow</a></p>
  
  <p>I have tried to modify it to get a seemless fade transition (transition: opacity 0.5s ease-in-out) from one div to the other, where both divs occupy the exact same position on the page, so that one div completely fades out before the other div begins to fade in.</p>
  
  <p>In jquery, it would be as simple as:</p>
  
  <pre><code>$("#divA").fadeOut(function() { $("divB").fadeIn(); });
  </code></pre>
  
  <p>Does anyone have any advice on the best way to achieve this with angular, with respect to the linked example, which uses a single model "checked" to trigger the transition?</p>