angularjs相同的指令（外點擊）多個元素

所以我有2個元素相同的指令：（CoffeeScript的）angularjs相同的指令（外點擊）多個元素

myApp.directive "clickOutside", ["$document", ($document) -> 
    restrict: "A" 
    link: (scope, elem, attr, ctrl) -> 
     elem.bind "click", (e) -> 
      e.stopPropagation() 
     $document.bind "click", -> 
      scope.$apply attr.clickOutside 
]

和HTML：

<div class="filter-box" click-outside="showFilterList=false"> 
    <div class="filter-title" ng-click="showFilterList=!showFilterList;">Open</div> 
    <ul class="filter-list" ng-class="{show:datePickerModel.showFilterList}"> 
     <li></li> 
     ... 
     ... 
    </ul> 
</div> 

<div class="filter-box" click-outside="showFilterList=false"> 
    <div class="filter-title" ng-click="showFilterList=!showFilterList;">Open</div> 
    <ul class="filter-list" ng-class="{show:datePickerModel.showFilterList}"> 
     <li></li> 
     ... 
     ... 
    </ul> 
</div>

我有2名DIV的是點擊在過濾器標題將更改showFilterList爲true，並通過該過濾器列表獲取'show'類。在元素外部單擊會將showFilterList設置爲false，並且filter-list會再次隱藏。對於一種場景，一切正常運行良好：單擊第一個元素filter-title並顯示過濾器列表。點擊第二個元素filter-title將顯示它自己的filter-list，但不會將已經點擊的第一個元素設置爲false。

我該怎麼做才能讓每個指令在觸發時都有自己的範圍？

謝謝！

來源

2013-08-19 aviramtsi

您是否試過在指令中給出範圍，即'scope：yes'？ – Florian

我現在試過了，仍然無法工作 – aviramtsi

Florian的答案對於爲指令創建隔離範圍是正確的請參閱：http://docs.angularjs.org/guide/directive（根據文檔，它應該是scope: true）。

從你的代碼我猜你的代碼中有其他東西可能導致它，因爲你有show:datePickerModel.showFilterList而其他地方你有showFilterList。可能問題在於showFilterList正在由其他東西在父範圍中創建。

嘗試在codepen或fiddle重新您的問題，它給了我們一些代碼來幫助你，經常我發現，在一個乾淨的環境重做我的問題可能會導致反正我找到了問題。

來源

2013-09-19 00:18:13

angularjs相同的指令（外點擊）多個元素

回答

相關問題