How to call link function method from html ng-click?

Question

I have the following code in my directive:

testModule.directive('TestOne',function(){
return{
replace: true,
controller: 'TestCtrl',
link: function(scope, element, attrs){

element.on('click', function(e) {
                     //my own code is there             
                });

}
}
}

I wanted to call the above click function on ng-click with the below event in html(ng-click="mytest()"). How can I call or write exactly so that I can execute my function requirements in the above directive's element click function as per my requirements.

html:

<div test-one ng-repeat="items in testjson">

<div class="title">{{items.name}}</div>
<div class="context-menu">
<ul>
<li ng-click="mytest()">TestFunction</li>
</ul>
</div>

</div>

Thanks in advance.

Sachila Ranawaka · Accepted Answer · 2017-03-28 10:22:06Z

First make the first letter of the directive simple

directive('TestOne',function(){

to

directive('testOne',function(){

Then create a scope function for ng-click inside the link function

.directive('testOne',function(){
        return{
          restrict : 'A',
          replace: true, 
          link: function(scope, element, attrs){ 
          scope.mytest = function() {
             console.log("working")           
           }

          }
        }
    })

Demo

angular.module("app",[])
.controller("ctrl",function($scope){
$scope.testjson = [{"name":"sss"},{"name":"ssss"}]

}).directive('testOne',function(){
    return{
      restrict : 'A',
      replace: true, 
      link: function(scope, element, attrs){ 
      scope.mytest = function() {
         console.log("working")           
       }

      }
    }
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<div test-one ng-repeat="items in testjson">

<div class="title">{{items.name}}</div>
<div class="context-menu">
<ul>
<li ng-click="mytest()">TestFunction</li>
</ul>
</div>

</div>
</div>

Collectives™ on Stack Overflow

How to call link function method from html ng-click?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related