Question

我有这样的指示

.directive('myModal', function() {
    return {
        restrict: 'A',
        replace: true,
        scope: {
            myModalId: '@'
        },   
        template: '<div id="{{myModalId}}" class="modal">' +
            '<div ng-click="parentMethod()" class="modal-dialog">' +
                '...' +
            '</div>' +
        '</div>'
    }
});

js code

function ParentController($scope) {
    $scope.parentMethod = function() {
        alert('clicked');
    }
}

Answer 1

有几种方法可以实现这一目标。我会使用属性绑定来实现它，它允许您在父作用域的上下文中执行表达式。这就是你如何使用它：

<div my-modal my-modal-id="12312" on-click="parentMethod()"></div>

然后在指令中定义这样的范围：

scope: {
    myModalId: '@',
    onClick: '&'
}

并在指令模板中：

<div ng-click="onClick()" class="modal-dialog">

演示：http://plnkr.co/edit/UDnJGRVqXqbCGSFEAMMA?p=preview

另一种方式（不推荐），您可以直接从隔离指令范围中引用父作用域：

<div ng-click="$parent.parentMethod()" class="modal-dialog">

Answer 2

<body ng-app="myApp">
<div ng-controller="myCtrl">
    <direct movied="movie" call-home="callFromDirect"></direct>
</div>

<script>
    var myApp = angular.module("myApp", []);

    myApp.controller("myCtrl", function($scope, $rootScope) {
        $scope.callFromDirect = function (param) {
            console.log('got call to direct ' + param);
        }
    });

    myApp.directive("direct", function () {
        return {
            restrict: 'E',
            scope: {
                callHome: '='
            },
            template: "<input type=\"button\" value=\"click\" ng-click=\"callHome('movie')\" />"
        }
    });
</script>

如何从指令调用父方法？

2 个答案:

演示：http://plnkr.co/edit/UDnJGRVqXqbCGSFEAMMA?p=preview