title: How do I ngShow and ngHide two different elements at the same time with AngularJS?
body: <p>So I have two elements that are exclusive:</p>
  
  <pre><code>&lt;span&gt;foo&lt;/span&gt;
  &lt;span&gt;bar&lt;/span&gt;
  </code></pre>
  
  <p>And I added ngShow and ngHide to them:</p>
  
  <pre><code>&lt;span ng-show="fooTime"&gt;foo&lt;/span&gt;
  &lt;span ng-hide="fooTime"&gt;bar&lt;/span&gt;
  </code></pre>
  
  <p>But now when these render, there is a split second where they both show.</p>
  
  <p>How can I make them show/hide at the same time?</p>