title: How to use mouseover and mouseout in Angular 6
body: <p>I have this older Angular code which works but not in the latest version of Angular 6.</p>
  
  <pre><code>&lt;div ng-mouseover="changeText=true" ng-mouseleave="changeText=false" ng-init="changeText=false"&gt;
    &lt;span ng-hide="changeText"&gt;Hide&lt;/span&gt;
    &lt;span ng-show="changeText"&gt;Show&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How do i make this work for Angular 6? I understand I have to use <code>(mouseover)</code> and <code>(mouseout)</code> but I couldn't implement it successfully.</p>