Question

我希望有人可以帮助我在点击具有特定css类的锚链接时实现一种干净有效的方法来触发函数。

我可以使用ng-click执行此操作，但我觉得这是一个混乱且无法维护的解决方案：这意味着将ng-click添加到我想要跟踪的每个锚链接中。

我的导航链接目前如下所示：

<li id="item1" class="foo"><a href="#/item1">CLICK ME</a></li>

我希望以类似于以下JQuery stubb的方式模拟ng-click的功能（在我的配置中似乎不起作用）：

$('.foo a').on('click', function(){
    //do some code 
});

TL;博士

当点击具有特定css类的元素时，我喜欢使用AngularJS方法来执行函数。

如果我没有充分描述这一点，请告诉我。

提前致谢，

JOHND

Answer 1

您可以编写指令并将其应用于根元素。

DEMO

<div ng-app="app" foo-dir>
    <li id="item1" class="foo"><a href="#/item1">CLICK ME 1</a>

    </li>
    <li id="item2" class="foo"><a href="#/item2">CLICK ME 2</a>

    </li>
</div>

的javascript

var app = angular.module("app", []);

app.directive("fooDir", function () {
    return {
        link: function ($scope) {
            $(".foo a").on("click", function (event) {
                alert($(this).html());
            });
        }
    }
});

Answer 2

您可以编写这样的自定义指令：

.directive('foo', function () {
  return {
    restrict: 'C',
    link: function (scope, element, attrs) {
      element.on('click', 'a', function (e) {
        console.log('clicked! do some code here.');
      });
    }
  }
});

示例Plunker： http://plnkr.co/edit/53gge6KUoEoedt1PD0RB?p=preview

AngularJS fire功能点击锚点链接

2 个答案: