title: How to handle remove from DOM effect?
body: <p>I have a view that is being rendered based upon a condition:</p>
  
  <pre><code>{{#if boolean}}
    {view MyView}}
  {{/if}}
  </code></pre>
  
  <p>I can easily add a nice animation for when the element is inserted into the DOM:</p>
  
  <pre><code>MyView: {
    didInsertElement: function() {
      this.$().hide().show('slide', {direction: 'left', duration: 2000});
    }
  }
  </code></pre>
  
  <p>However, the same cannot be done when the element is removed from the DOM:</p>
  
  <pre><code>MyView: {
    willDestroyElement: function() {
      this.$().hide('slide', {direction: 'right', duration: 2000});
    }
  }
  </code></pre>
  
  <p>This does not work because the element is being shown based upon a condition that is beyond this view's control the element is removed from the DOM immediately. The async animation never runs.</p>
  
  <p>What is the best way to handle this?</p>