angularjs - how to bind click event in angular js? -

i trying make custom directive in angularjs .i able make custom directive of menu option menu option https://jqueryui.com/menu/ .but need menu option display when user click or mouseover event on button.

http://codepen.io/anon/pen/ovnqmg

var app = angular.module("ionicapp", ['ionic']); app.directive('custommenu', function() {     return {         restrict: 'a',         scope: {},         link: function(scope, element, attr) {             $(element).menu();         }     } }); app.controller('cnt', function($scope) {     $scope.showmenu = function() {         // code here     } }); 

how bind click or mouse on event custom directive ?

use ngclick , ngmouseover directives respectively

• ngmouseover
• ngclick

e.g.

<div ng-controller="cnt">     <button ng-click="showmenu()">click menu</button>     <button ng-mouseover="showmenu()">hover menu</button> </div> 

edit:

need call menu() on element. should able pass element through below, though might need editing haven't tested code.

$scope.showmenu = function(element) {     element.menu(); }  <div ng-controller="cnt">     <button ng-click="showmenu($element)">click menu</button>     <button ng-mouseover="showmenu($element)">hover menu</button> </div>