如何在按钮上单击angular2打开div手风琴

时间:2017-03-02 10:26:42

标签: angular

我手风琴如图所示

<div class="panel-group" id="accordion">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">
        Collapsible Group 1</a>
      </h4>
    </div>
    <div id="collapse1" class="panel-collapse collapse in">
      <div class="panel-body">Text1  <button (click)="Open()">Apply</button></div>
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">
        Collapsible Group 2</a>
      </h4>
    </div>
    <div id="collapse2" class="panel-collapse collapse">
      <div class="panel-body">Text2</div>
    </div>
  </div>
</div>

我想根据第一个面板中的按钮单击打开第二个可折叠面板。我怎么能在角度2中做到这一点?

1 个答案:

答案 0 :(得分:0)

您可以使用引用变量来定义操作中使用的元素:

QGraphicsScene

这是用变量

装饰的面板
<button (click)="open(panel)">Apply</button>

您的处理程序

<div #panel class="panel-collapse collapse">
  <div class="panel-body">Text2</div>
</div>

检查这个小提琴 https://jsfiddle.net/vadimb/p3c7k6ne/