Javascript 带有click事件的Angular指令被调用两次

我遇到一个问题，我的点击事件被调用了两次。不确定我遗漏了什么，但我在应用程序中只包含了一次此指令。我已经尝试只将指令添加到一个元素中，但是调用仍然发生了两次

有人能看一下代码，告诉我我遗漏了什么吗

angular.module('mymodule', [])
.directive('mydirective', function () {
    return {
        restrict: 'AE',
        link: function ($scope, $element, $attrs) {

            $element.children().bind('click', function () {

                console.log("test" + this);

                if ($element.hasClass('active')) {
                    $element.removeClass('active');
                    return;
                } else if (!$element.hasClass('active')) {
                    $element.addClass('active');
                    return;
                }
            });
        }
    }
});

---

在click函数中使用此选项可停止冒泡事件

 e.stopPropagation();

---

要了解更多信息，请在单击函数中使用此选项停止冒泡事件

 e.stopPropagation();

---

要了解更多信息，请检查我知道我回答这个问题太晚了，几个月前我也面临着这个问题。然而，这里的一位先生要求我将此附加到指令中。而且，它工作得很好

e.stopImmediatePropagation();

---

我知道我回答这个问题已经晚了，几个月前我也面临着这个问题。然而，这里的一位先生要求我将此附加到指令中。而且，它工作得很好

e.stopImmediatePropagation();

---

$element.toggleClass（'active'）；返回适用于您的所有条件。不知道为什么双击会发生。。。尝试
event.stopPropagation（）尝试将单击事件添加到父元素而不是子元素，例如，尝试$element.parent（）…bind（'click'，function（）…
$element.toggleClass（'active'）；return；
用于所有条件。不确定为什么会发生双击…尝试
event.stopPropagation（）尝试将单击事件添加到父元素而不是子元素，例如尝试$element.parent（）…bind（'click'，function（）…）。。。