What
is ng-mousemove directive? Why we use it?
The ng-mousemove
is used to specify to perform the custom behaviour on
mouse move event.
If you want to add and fire a mouse
move event on HTML button that time we need to use these events.
When you mouse move on focused button
in the below example, the ngMousemove function get called.
As you can see in the below controller
function "mousemove"
get called after ngMousemove on button.
//The HTML Code sample <button ng-mousemove="mousemove(IsActive)">NG-MOUSEMOVE </button> //The AngularJs Code sample: var app = angular.module('myApp', []); app.controller('ngClickCtrl', function ($scope) { $scope.firstName = "Anil"; $scope.lastName = "Singh"; $scope.IsActive = false; $scope.mousemove = function (IsActive) { if (!IsActive) { $scope.IsActive = true; } else { $scope.IsActive = false; } }; }); //The AngularJs and HTML code sample: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>What is ng-mousemove directive? Why we use it?</title> @*<script src="https://code.angularjs.org/1.4.1/angular.js"></script>*@ <script> var app = angular.module('myApp', []); app.controller('ngClickCtrl', function ($scope) { $scope.firstName = "Anil"; $scope.lastName = "Singh"; $scope.IsActive = false; $scope.mousemove = function (IsActive) { if (!IsActive) { $scope.IsActive = true; } else { $scope.IsActive = false; } }; }); </script> </head> <body ng-app="myApp"> <div ng-controller="ngClickCtrl"> <div> First Name: <input type="text" ng-model="firstName"> Last Name: <input type="text" ng-model="lastName"> <button ng-mousemove="mousemove(IsActive)">NG-MOUSEMOVE </button> </div> <div> <div ng-show="IsActive"> <h3>Full Name: {{firstName + " " + lastName}} </h3></div> </div> </div> </body> </html>The live output as,
About Blogger
|
Hey! I am Anil Singh. I am Active Blogger, Writer and Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
|
0 comments:
Post a Comment