Ng-Mouseover-3

 
When we over the mouse on array elements then mouseOver(p) function is call and display particular element below on which we over the mouse.
 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> </head> <body ng-app="app"> <div ng-controller="controllerName"> <div ng-repeat="p in Arrs"> <div style="background-color:gray;height:30px;width:100px" ng-mouseover="mouseOver(p)">{{p}}</div><br /> </div> <pre>Mouse Over <b>{{data}}</b></pre> </div> <script> var app = angular.module("app", []); app.controller('controllerName', ['$scope', function ($scope) { $scope.mouseOver = function (data) { $scope.data = data; }; $scope.Arrs = ["First", "Second", "Third", "Fourth"] }]); </script> </body> </html>
Output