如何打开按钮，点击angular2

Question

一个div手风琴我有一个手风琴如图

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

Answer 1

您可以使用引用变量定义在行动中使用的元素：

<button (click)="open(panel)">Apply</button> 

这里是你的面板装饰有可变

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

你处理

open(panel) { 
    panel.classList.remove("collapse"); 
} 

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