Question

我需要有一个整体的显示/隐藏点击来显示或隐藏＆＃34;面板列表中的所有细节div＃34;数据的。同样在每个面板中，有一个显示/隐藏点击以单独显示或隐藏该数据div。

我认为如果点击整体显示/隐藏，则单击时应将单个点击值设置为等于整体值。这样，如果更改了各个，它们都被设置为在单击主要时显示或隐藏。

这就是我尝试这样做的方式：

    <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>

tender_panel.html的隐藏/显示部分在此处：

     <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>

在招标底桌上方还有另一张桌子。再加上另一张桌子。

发生的事情是它在初始加载时工作正常。全部隐藏/显示全部工作。然后我点击个人秀/隐藏他们的工作。但是All Show / All Hide不再适用，我也不知道点击个别链接会如何破坏。

此应用程序是带有Angular和Bootstrap的Symfony2。

非常感谢任何帮助。

Answer 1

你可以尝试的一件事是在每个标书项目中设置一个属性标志，如果显示/隐藏它，并根据hideAllDetails +标志是否为真显示单个项目：

<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.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>

使用angularjs中的显示/隐藏部分显示/隐藏所有部分

1 个答案: