首页 > 解决方案 > 仅在打开扩展面板时如何在 Angular 中触发事件

问题描述

我试图通过更改触发它们的事件来减少发送的网络请求的数量。我只希望fetchAvailableCompanies http 请求在展开面板打开时触发,而不是在面板关闭时触发。

这是我的组件html:

 <mat-accordion *ngIf="modules">
    <mat-expansion-panel *ngFor="let module of modules">
      <mat-expansion-panel-header (click)="fetchAvailableCompanies(module.module_name)">
        <mat-panel-title>
          {{module.module_name}}
        </mat-panel-title>
      </mat-expansion-panel-header>
      <div *ngFor="let company of availableCompanies[module.module_name]">
        <mat-checkbox>{{company.name}}</mat-checkbox>
      </div>
    </mat-expansion-panel>
  </mat-accordion>

而不是在点击时使用,也许我应该打开/展开和关闭/折叠?不知道如何实现。我还计划使用 Http 拦截器实现对 http 响应的缓存。这会影响我应该如何处理当前的问题吗?

任何帮助将不胜感激,谢谢:)

标签: angularrxjs

解决方案


有一个事件afterExpandmat-expansion-panel不是标题):

<mat-expansion-panel *ngFor="let module of modules" (afterExpand)="fetchAvailableCompanies(module.module_name)">
    <mat-expansion-panel-header>

推荐阅读