2 回答

TA貢獻1877條經驗 獲得超6個贊
好的!因此,這里找到了一種在頁面加載時也控制按鈕狀態的解決方案。
isOpenEver = false;
get openCloseState(): string|undefined{
if(!this.isOpenEver){
return undefined;
}
return this.isOpen ? 'open' : 'closed';
}
togglePanel(): void {
this.isOpenEver = true;
this.isOpen = !this.isOpen;
}
并使用HTML按鈕中的狀態:
<button [class.button-resize-expand]="!isOpen"
[class.button-resize-collapse]="isOpen"
(click)="togglePanel()" [@openClose] ="openCloseState">
<mat-icon class="rotate-chevron" [class.rotate-clicked]="!isOpen">{{isOpen ? 'chevron_left' : 'chevron_right'}}</mat-icon>
</button>
這也是更新的stackblitz
添加回答
舉報