Angular 指令在不使用隔离作用域的情况下执行函数答案

【问题标题】：Angular directive executing a function without using isolate scopeAngular 指令在不使用隔离作用域的情况下执行函数
【发布时间】：2015-03-14 20:29:48
【问题描述】：

我正在尝试创建一个指令，该指令仅在单击它所在的元素时触发单击事件。如果单击子元素，我不希望触发单击事件。这就是我到目前为止所拥有的，并且似乎正在奏效。

bizi.directive('bbStrictClick', [
function () {
    return {
        restrict: 'A',
        replace: false,
        scope: {
            clicked: '&bbStrictClick'
        },
        link: function (scope, element, attrs, controller) {
            element.click(function (event) {
                if (event.target === element[0]) {
                    event.stopImmediatePropagation();
                    event.stopPropagation();

                    scope.clicked();
                }
            });
        }
    };
}

]);

问题是我正在使用隔离范围，因此我无法将此指令添加到具有使用隔离范围的其他指令的元素。有没有办法在不使用隔离作用域的情况下执行指令属性值中指定的函数？

【问题讨论】：

标签： javascript jquery angularjs angularjs-directive

【解决方案1】：

是的，使用 $scope.$eval:

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$eval

bizi.directive('bbStrictClick', [
function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs, controller) {
            element.click(function (event) {
                if (event.target === element[0]) {
                    event.stopImmediatePropagation();
                    event.stopPropagation();

                    scope.$eval(attrs.bbStrictClick);
                }
            });
        }
    };
}])

您还可以使用 $parse 将表达式预解析为一个函数，然后执行该函数（基本上是 & 所做的）。

编辑：你可以看看 ngClick 是如何在 Angular 的源代码中编码的：https://github.com/angular/angular.js/blob/v1.3.14/src/ng/directive/ngEventDirs.js#L49

【讨论】：