Javascript 如何使用$（目标）内部指令？

我构建了一个带有两个块的时间选择指令。问题是捕获指令模板内某些块上的目标事件。 指令模板：

<div class='time-picker-container'>
    <div class='block1' ng-click='show()'>1</div>
    <div class='block2' ng-show='selectVisible'>2</div>
</div>

基本思想：当用户点击文档时，在div.block2之外，block消失。当用户单击某个位于div.block2块内的对象时，该对象保持可见

运行时功能：

angular.element(document).on('click', function(e) {
        $rootScope.$broadcast('documentClicked', angular.element(e.target));
    });

---

在模板中，将

$event

作为参数添加到

ng click

处理程序函数中

<div class='time-picker-container'>
    <div class='block1' ng-click='show($event)'>1</div>
    <div class='block2' ng-show='selectVisible'>2</div>
</div>

为防止内存泄漏，请确保在销毁作用域时删除$document click处理程序

---

.

是否已在某个地方为单击的

文档进行广播？将有助于让该事件对象在运行时使用Yes函数。我编辑了这篇文章。
<div class='time-picker-container'>
    <div class='block1' ng-click='show($event)'>1</div>
    <div class='block2' ng-show='selectVisible'>2</div>
</div>

angular.module("myApp").controller("myVm", function($scope, $document) {
    var vm = $scope;
    vm.selectVisible = false;

    vm.show = function(event) {
       console.log("inside click");
       event.stopPropagation();
       vm.selectVisible = vm.selectVisible ? false : true;
    }

    function outsideClickHandler(e) {
        console.log("outside click");
        $scope.$apply("selectVisible = false");
    }
    $document.on("click", outsideClickHandler);

    $scope.$on("destroy", function() {
        $document.off("click", outsideClickHandler)
    })
})