簡體   English   中英

Angular指令在不使用隔離范圍的情況下執行功能

[英]Angular directive executing a function without using isolate scope

我正在嘗試創建僅在單擊了其上的元素時才觸發click事件的指令。 如果子元素被單擊,我不希望觸發click事件。 到目前為止,這就是我的想法,而且似乎正在解決問題。

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();
                }
            });
        }
    };
}

]);

問題是我正在使用隔離范圍,因此我無法將此指令添加到具有其他使用隔離范圍的指令的元素中。 有沒有一種方法可以在不使用隔離范圍的情況下執行指令屬性值中指定的功能?

是的,使用$ 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

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM