Question

希望你能解决我的问题。我有2个案例：

案例＃1 ：Fiddle，当我点击父div时，我试图触发子div的ng-click功能（也涉及ng-click父母），但我收到一个错误（$ apply已在进行中）。

控制器：

function MyCtrl($scope) {
    $scope.pressOnParent = function ($event) {
        event.stopPropagation();
        console.log("Click over the parent");
        $("#child").trigger("click");
    }

    $scope.pressMe = function ($event) {
        $event.stopPropagation();
        console.log("I am being pressed");
    }
}

案例＃2 ：Fiddle，我正在尝试做同样的事情，但不在父级中使用ng-click（但使用jquery将click事件附加到它）

控制器：

function MyCtrl($scope) {
    $("#parent").on("click", function (event) {
        event.stopPropagation();
        console.log("Click over the parent");
        $("#child").trigger("click");
    });

    $scope.pressMe = function ($event) {
        $event.stopPropagation();
        console.log("I am being pressed");
    }
}

我的主要目标是尝试解决案例＃1，因为这与我在项目中的最终代码非常相似。有什么想法吗？

感谢你们给我的帮助！

Answer 1

在控制器内部进行DOM操作被认为是一种不好的做法，应该避免使用，所以不要使用JQuery，而只需在父函数中调用子函数。

示例：

function MyCtrl($scope) { $scope.pressOnParent = function ($event) { event.stopPropagation(); console.log("Click over the parent"); $scope.pressMe($event); } $scope.pressMe = function ($event) { $event.stopPropagation(); console.log("I am being pressed"); } }

编辑你的小提琴：http://jsfiddle.net/choroshin/rMXrA/

Answer 2

这里的方法是针对Angular的声明性原则。而不是找到子div并在父回调中单击它应该更明确。考虑这个例子

function MyCtrl($scope) {

    var logger = function () {
        console.log("I am being pressed");
    };

    $scope.pressOnParent = function () {
        console.log('parent clicked');
        logger();
    };

    $scope.pressMe = function () {
        logger();
    };
}

从父元素触发单击子元素

2 个答案: