自定义切换功能中垫扩展标题的更改图标

Question

我只想在图标的材质上调用面板的扩展，而不是使用以下代码的完整标题：

component：

     expandPanel(matExpansionPanel: MatExpansionPanel, event: Event): void {
            event.stopPropagation();

            if (!this._isExpansionIndicator(event.target)) {
              matExpansionPanel.toggle();
              console.log(event.target)
            }
          }

          private _isExpansionIndicator(target: EventTarget): boolean {
            const expansionIndicatorClass = 'icon-Expand';
            const element = event.target as HTMLInputElement;
            return (
              element.classList && element.classList.contains(expansionIndicatorClass)
            );
          }

html：

    <mat-expansion-panel-header (click)="expandPanel(matExpansionPanel, $event)">
        <div class="controller">        
           <span class="icon-Expand">expand</span>
         </div>
       </div>
    </mat-expansion-panel-header>
``

It is working as expected but I want to use custom template such that when the panel is collapsed, the class `icon-Expand` is changed to `icon-collapse`

How can I achieve that?

Answer 1

*ngIf="matExpansionPanel.expanded; else isCollapsed"

这将起作用