angular - 当我打开另一个面板时调用 的 (closed) 函数

Question

我正在使用 mat-accordion，里面有多个 mat-expansion-panel。在第一个 mat-expansion-panel 上，我调用了一个函数(关闭)。默认情况下，第一个 mat-expansion-panel 是关闭的。现在当页面加载并且我点击第二个 mat-expansion-panel 时，第一个 mat-expansion-panel(关闭)的函数被调用(这不应该是因为它还没有打开)。

我希望当我们打开一个扩展面板然后关闭它或任何其他打开任何其他扩展面板时，只有第一个扩展面板的(关闭的)函数会被调用。

<mat-accordion class="example-headers-align myaccordion">
             <mat-expansion-panel  hideToggle="true" class="myexpension" (opened)="fetchGeneralInfo()" (closed)="collpaseClose(0)"  #generalInfo>
             <mat-expansion-panel-header>
                <mat-panel-title>
                            General Information
                </mat-panel-title>
 </mat-expansion-panel>

   <mat-expansion-panel hideToggle="true" class="myexpension" #guaInfo (opened)="fetchGua()" >
    <mat-expansion-panel-header>
      <mat-panel-title>
        Gurantor Information
      </mat-panel-title>
 </mat-expansion-panel>

Answer 1

mat-accordion 组件有一个输入属性multi。@Input()multi: boolean : Accordion 是否应该同时允许多个展开的 Accordion 项目。由于它未设置为 true，因此可能会触发其他扩展面板的关闭事件。将 multi 设置为 true <mat-accordion [multi]="true">并检查。