一尘不染

从指令中调用控制器函数,而在AngularJS中没有隔离范围

angularjs

我似乎找不到不使用隔离范围从指令内调用父范围内的函数的方法。我知道,如果我使用隔离作用域,则可以在隔离作用域中使用“&”来访问父作用域上的函数,但是在不必要时使用隔离作用域会产生后果。考虑以下HTML:

<button ng-hide="hideButton()" confirm="Are you sure?" confirm-action="doIt()">Do It</button>

在这个简单的示例中,我想显示一个JavaScript确认对话框,并且仅当他们在确认对话框中单击“确定”时才调用doIt()。使用隔离范围很简单。该指令如下所示:

.directive('confirm', function () {
    return {
        restrict: 'A',
        scope: {
            confirm: '@',
            confirmAction: '&'
        },
        link: function (scope, element, attrs) {
            element.bind('click', function (e) {
                if (confirm(scope.confirm)) {
                    scope.confirmAction();
                }
            });
        }
    };
})

但是问题是,因为我使用的是隔离范围,所以上例中的ng-hide不再针对父范围执行
,而是在隔离范围内执行(因为在任何指令上使用隔离范围都会导致该元素上的所有指令使用隔离范围)。这是上面示例的jsFiddle,其中ng-
hide不起作用。(请注意,在此小提琴中,当您在输入框中键入“是”时,按钮应该隐藏。)

另一种选择是 不要使用隔离范围 ,这实际上是我在这里真正想要的,因为不需要将此指令的范围隔离。我唯一的问题是,
如果不在隔离范围内传递方法,该如何在父范围内调用方法

这是一个我没有使用隔离范围的jsfiddle,而ng-
hide可以正常工作,但是,当然,对confirmAction()的调用不起作用,并且我不知道如何使它起作用。

请注意,我真正要寻找的答案是如何在不使用隔离范围的情况下在外部范围内调用函数。
而且我对使此确认对话框以另一种方式工作不感兴趣,因为这个问题的目的是弄清楚如何对外部作用域进行调用,并且仍然能够使其他指令在父作用域内起作用。

另外,如果其他指令仍然可以对父作用域起作用,那么我会很想听到使用隔离作用域的解决方案 ,但是我认为这是不可能的。


阅读 201

收藏
2020-07-04

共1个答案

一尘不染

由于伪指令仅调用函数(而不是尝试在属性上设置值),因此可以使用$
eval
代替$
parse(具有非隔离范围):

scope.$apply(function() {
    scope.$eval(attrs.confirmAction);
});

或更好的是,只需使用$
apply
,这将使$
eval()将其参数反对作用域:

scope.$apply(attrs.confirmAction);

小提琴

2020-07-04