anglejs内の表示/非表示セクションをすべて表示/非表示

Question

データの「パネル」リストのすべての詳細ディビジョンを表示または非表示にするには、全体的な表示/非表示のクリックが必要です。また、各パネル内には、そのデータの部分を個別に表示または非表示にするためのShow/Hideクリックがあります。

全体的な表示/非表示をクリックすると、個々のクリック値をクリックすると全体の値と同じに設定する必要があると思います。そうすれば、個々のものが変更された場合、それらはメインのものがクリックされたときにすべて表示または非表示に設定されます。

これは私がそれを行うことを試みた方法です：

 <div>- <a href='#' ng-click="hideDetails = ! hideDetails">Hide Details</a></div> 
    <div class="tender-details" ng-hide="hideDetails"> 

     <table width="100%" id="tender-bottom-table"> 
     <tbody> 
      ... 
     </tbody> 
     </table> 
    </div> 

が柔らかく、ボトム上の別のテーブルがあります：tender_panel.htmlの表示/非表示の一部はここにある

<div>- <a href='#' ng-click="hideAllDetails = ! hideAllDetails; hideDetails = hideAllDetails">Hide All Details/+ Show All</a></div> 

    <div class="tender-list" ng-repeat="row in tenders" ng-include="'tender/tender_panel.html'"></div> 

表。後に別のテーブルをプラスします。

何が起こっているかは、最初に読み込まれたときに正常に動作することです。すべて表示/すべて表示の作業。それから私は個々のショー/隠れをクリックし、彼らは働きます。しかし、その後、All Show/All Hideは動作しなくなり、個々のリンクをクリックすることでどのように物事が崩れるのか分かりません。

このアプリは、角度とブートストラップを備えたSymfony2です。

ご協力いただければ幸いです。

<div>- <a href='#' ng-click="hideAllDetails = ! hideAllDetails;">Hide All 
Details/+ Show All</a></div> 
<div class="tender-list" ng-repeat="row in tenders" ng- 
include="'tender/tender_panel.html'"></div> 

tender_panel：あなたが試みることができる

Answer 1

一つのことは、それが隠し/示すかどう設定し、各入札項目内のプロパティフラグを持っているとhideAllDetails +そのフラグがtrueの場合に基づいて個々のアイテムを表示することです。 html：

<div>- <a href='#' ng-click="row.hideDetails = ! row.hideDetails">Hide 
    Details</a></div> 
<div class="tender-details" ng-hide="hideDetails || hideAllDetails"> 

    <table width="100%" id="tender-bottom-table"> 
    <tbody> 
     ... 
    </tbody> 
    </table> 
</div>