How to use mouseover and mouseout in Angular 6

Question

I have this older Angular code which works but not in the latest version of Angular 6.

Answer 1

To avoid blinking problem use following code
its not mouseover and mouseout instead of that use mouseenter and mouseleave


**app.component.html**

    

      Hide
      Show
    

**app.component.ts**

@Component({
   selector: 'app-main',
   templateUrl: './app.component.html'
})
export class AppComponent {
    changeText: boolean;
    constructor() {
       this.changeText = false;
    }
}