AngularJS ngmousemove

ng-mousemove directive is used to specify the custom behavior that execute when a mouse cursor moves over the specific HTML element.
In AngularJS, the ng-mousemove directive will not override the HTML element’s original onmousemove event, both will be executed.
The ng-mousemove directive is compiling at the priority level "0".(zero is a default priority level).
ng-mousemove is supported by all HTML element.

Syntax for ng-mousemove directive in AngularJS:

<element ng-mousemove="expression" > </element>

Parameter value for ng-mousemove directive in AngularJS:

Value	Description
expression	It is used to define an expression that execute when a mouse cursor moves over an element.

Sample coding for ng-mousemove directive in AngularJS:

 Tryit<!DOCTYPE html>
<html>
    <head>
        <title>Wikitechy AngularJS Tutorials</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/
            angular.min.js"></script>       
    </head>
    <body ng-app="">
        <h2>ng-mousemove directive in AngularJs</h2> 
        <button ng-mousemove="count = count + 1" ng-init="count=0"> 
                Mouse moves here!   
        </button> 
        <h3> The mousemove count: {{ count }} </h3>
    </body>
</html>

Code Explanation for ng-mousemove directive in AngularJS:

Code Explanation for AngularJS ngmousemove

AngularJS is distributed as a JavaScript file, and can be added to a HTML page with a <script> tag.
The AngularJS application is defined by ng-app="". The application runs inside the <body> tag.It’s also used to define a <body> tag as a root element.
The ng-mousemove= “count=count+1” is used to increase the count variable by one,every time the mouse cursor moves over the button element.
The ng-init="count = 0" is used to define the initial value of the count variable is 0.
The {{ count }} used to dynamically bind the count variable value when the mouse cursor moves over the button element.

Sample Output for ng-mousemove directive in AngularJS:

The output displays that a mouse cursor moves over the “Mouse moves here!”button and the content “The mouse moves count:20”. Here the variable “count” will increased a value by 1, every time a mouse cursor moves over the “Mouse moves here!” button.

PDF

AngularJS ngmousemove

Syntax for ng-mousemove directive in AngularJS:

Parameter value for ng-mousemove directive in AngularJS:

Sample coding for ng-mousemove directive in AngularJS:

Code Explanation for ng-mousemove directive in AngularJS:

Sample Output for ng-mousemove directive in AngularJS:

Related Searches to angularjs ng-mousemove directive

Wikitechy

Join our Community

Other Languages