angularjs - 防止在父元素上触发 Angular Material md-swipe-left/md-swipe-right 指令的功能

Question

我有一个填充 100% 页面高度的父元素和其中的几个子元素。在父级上向右滑动会切换侧面菜单，但我想阻止此功能并在其子级上向右滑动时触发 childAction()。

<div id="parent" md-swipe-right="toggleSideMenu()">
    <div id="child" md-swipe-right="childAction()">
        ....
    </div>
</div>

Answer 1

与所有其他事件指令一样，md-swipe-right 提供 $event 作为本地指令。 ¹

在 HTML 中包含 $event 作为函数的参数。

<div id="parent" md-swipe-right="toggleSideMenu()">
    <div id="child" md-swipe-right="childAction($event)">
        ....
    </div>
</div>

在 Controller 中调用 stopPropagation() 函数。

$scope.childAction = function (event) {
     event.stopPropagation();
});

有关 $event 的更多信息，请参阅 AngularJS Developer Guide -- expressions -- $event