yes there is on-mouseover in angular2 instead of ng-Mouseover like in angular 1.x so you have to write this :-
<div on-mouseover='over()' style="height:100px; width:100px; background:#e2e2e2">hello mouseover</div>
over(){
console.log("Mouseover called");
}
As @Gunter Suggested in comment there is alternate of on-mouseover we can use this too. Some people prefer the on- prefix alternative, known as the canonical form.
HTML Code -
<div (mouseover)='over()' (mouseout)='out()' style="height:100px; width:100px; background:#e2e2e2">hello mouseover</div>
Controller/.TS Code -
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
name = 'Angular';
over(){
console.log("Mouseover called");
}
out(){
console.log("Mouseout called");
}
}
Some other Mouse events can be used in Angular -
(mouseenter)="myMethod()"
(mousedown)="myMethod()"
(mouseup)="myMethod()"