如何从 html ng-click 调用链接函数方法?

Posted

技术标签:

【中文标题】如何从 html ng-click 调用链接函数方法?【英文标题】:How to call link function method from html ng-click? 【发布时间】:2017-08-21 08:40:07 【问题描述】:

我的指令中有以下代码:

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

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




我想用 html(ng-click="mytest()") 中的以下事件在 ng-click 上调用上述点击函数。我该如何准确地调用或编写,以便我可以根据我的要求在上述指令的元素单击功能中执行我的功能要求。

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>

提前致谢。

【问题讨论】:

【参考方案1】:

首先让指令的第一个字母简单

directive('TestOne',function()

directive('testOne',function()

然后在链接函数里面为ng-click创建一个作用域函数

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

          
        
    )

演示

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>

【讨论】:

以上是关于如何从 html ng-click 调用链接函数方法?的主要内容,如果未能解决你的问题,请参考以下文章

调用函数时如何使用模板值?

AngularJS 使用 ng-click 调用控制器内的函数

在 ng-repeat 中为 ng-click 查找范围

AngularJS ng-click事件点击无效

如何在 ng-click 中调用 json 数组?

使用 ng-click 函数激活 $interval