Angular.js关闭并点击任何地方，但在元素上

这是非常普遍的事情，就像在这里点击收件箱在stackoverflow上一样。我会打电话给那个对话框，或者打开一个的东西。Angular.js关闭并点击任何地方，但在元素上

现在有两个方法，我所知道的解决这个问题，

创建，你只开了元素有较大的Z-索引一种无形的叠加，而你通过点击关闭事情覆盖
单击文档上的事件，并且您检查是否点击了您的事物还是外部事件，在这种情况下，您关闭了事件。

在这两种情况下，我非常喜欢用ng-class添加/删除类，将显示/隐藏事情。

现在我该如何做到这一点与角度，所以它可以用于任何组件（东西），我可能会添加。这不像我有单一的模式，我可能有不同的组件，具有不同的html结构，定位和东西。

哪种方法会更好，文档事件，覆盖或其他什么东西？

由于angular并没有真正引用dom，所以文档方法可能是个问题，对，因为我无法完全检查是否点击了thing元素？除非我给每东西同一类。

另一方面，叠加方法不需要任何参考dom元素。

这两种方法都需要在rootScope独特的VAR为ng-class工作..这带来的问题是使用ng-class或定制的东西..

反正只是扔我的想法在那里，也许我想关于它从一开始就错了，有没有人处理过这个？

来源

2014-01-27 foxx

看看这个可以看出，它可以帮助你http://fundoo-solutions.github.io/angularjs-modal-service/ – Misters

我会去一个自定义指令，并在文档上单击事件。 –

你怎么知道它不应该在点击事物元素时关闭？永远同一班？没有任何一种DOM对角度方式进行搜索？ – foxx

我使用inheritedData沟通，单击处理程序无论是在或出了事情才解决了这样的事情的方式：

在对事物的定制指令，添加数据变量元素，使用jqLite数据，说element.data('myThing',true)。如果您想区分该事物的多个实例，则可能需要使用一些唯一生成的密钥。
在相同的自定义指令中，在文档上的单击事件处理程序中。身体，你可以检查angular.element(event.target).inheritedData('myThing')

采用此方法的一个例子指令低于

app.directive('thing', function($document,$window) { 
    return { 
    restrict: 'E', 
    template: '<div><span>Inner thing</span></div>', 
    replace: true, 
    link: function(scope,element) { 
     element.data('thing',true); 

     angular.element($document[0].body).on('click',function(e) { 
     var inThing = angular.element(e.target).inheritedData('thing'); 
     if (inThing) { 
      $window.alert('in'); 
     } else { 
      $window.alert('out'); 
     } 
     }) 
    } 
    } 
});

，并可以在此Plunker http://plnkr.co/edit/bRDLcLoesM7Z0BIxKxYu?p=preview

来源

2014-01-27 19:41:11

Angular.js关闭并点击任何地方，但在元素上

回答

相关问题