单击事件时调用作用域方法的角度指令

debugcn 发表于 Dev

你好

我有一个带有k-grid-cancel-changes类的按钮的网格。我想创建一个指令，该指令将click事件附加到该按钮并在页面范围内调用方法

    .directive('kGridCancelChanges', function () { 
               return {
                restrict: 'C',                
                scope: {
                    onCancelChanges: "&"
                },
                controller: function ($scope, $element, $attrs, $location) {
                    $element.click(function () {
                        $scope.onCancelChanges();
                    });
                }

            }
});

当我按下按钮时，我可以看到$ scope.onCancelChanges（）从我的指令中被触发，但是它从未到达页面范围内的函数。

 $scope.onCancelChanges = function () {
               alert('test');
            }

我将不胜感激任何建议

dfsq

如果要在范围内调用函数，则必须这样提供：

<button class="k-grid-cancel-changes" on-cancel-changes="onCancelChanges()">test</button>

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

如果由于某种原因您不能修改HTML代码（例如，它是由Kendo动态呈现的）并且不能添加属性，那么您只能访问要通过$parent作用域引用进行调用的函数：

$scope.$parent.onCancelChanges();

演示：http：//plnkr.co/edit/tpEEZs9VQunKXABud9yN？p = preview

最后，如果指令的隔离范围不是主要的，那么您可以简单地调用该函数，因为它具有相同的范围：

.directive('kGridCancelChanges', function() {
    return {
        restrict: 'C',
        controller: function($scope, $element, $attrs, $location) {
            $element.click(function() {
                $scope.onCancelChanges();
            });
        }
    }
});