如何檢測在angularjs範圍以外的點擊

我有一個角度控制器，無論用戶何時單擊控制器的範圍外，都需要重置。我該怎麼做呢？如何檢測在angularjs範圍以外的點擊

樣本HTML：

<div id='parent'> 
    <div id='1' ng-controller="ctrl1"> 
     <!--other things--> 
    </div> 

    <div id='2' ng-controller="ctrl2"> 
     <!--other things--> 
    </div> 
</div> 
<div id="parent2"> 
     <!--other things--> 
</div>

我希望能夠在發生的ctr2之外的點擊重置CTRL 2時發生點擊DIV2外

CTR2已內

來源

2013-06-21 Ranjith Ramachandra

定義的復位功能

您可以使用$rootScope將事件廣播到其他控制器。看到這個JSFiddle：http://jsfiddle.net/simpulton/XqDxG/

來源

2013-06-21 06:05:42

所以沒有辦法從控制器內部做到這一點？我正在考慮使用$ window服務。 –

['$ window']（http://docs-angularjs-org-dev.appspot.com/api/ng.$window）只是封裝瀏覽器的'window'對象。 –

非常感謝。它像魅力一樣工作！ –

如果你想要一個重置，當點擊發生在同級格內，那麼控制器共享$scope這一事實應該是相當簡單的。如果要重置div時點擊發生其他地方的頁面上，那麼你應該設置「復位」格爲指令，該$window對象綁定到單擊處理：

app.directive('reset', function($window){ 
    return { 
    template: '<div ng-class="{red: directiveToggler}">I\'m in 2' + 
       ' - click me to turn red, click anywhere else to turn me normal'+ 
       '</div>', 
    controller: function($scope){ 
    $scope.directiveToggler = true; 
    }, 
    link: function(scope, element){ 

    var w = angular.element($window); 
    w.bind('click', function(e){ 

     if (e.target != element[0].children[0]){ 
     scope.directiveToggler = false; 
     scope.$apply(); 

     } else { 
     scope.directiveToggler = true; 
     scope.$apply() 
     } 
    }) 
    } 
    } 
})

注意有可能waaay處理班級/風格變化的方式比我設置的更好，但問題是關於點擊事件;）。

Here's a plunk to demo

來源

2013-06-21 15:47:57 rGil

我將您的答案與http://stackoverflow.com/a/17338860/130641結合起來，提供多元素指令解決方案。謝謝。 –

如何檢測在angularjs範圍以外的點擊

回答

相關問題