默认状态下没有角度动画

Question

您好，这里是我的更新代码，其中包含左右滑动的动画。因此，我想看看是否可以在没有任何动画的情况下控制默认状态。就像当面板为“ TRUE”时不应该有任何动画，并且当我们单击按钮时，动画应该照常工作。现在，我可以控制滑块的默认状态，但是仍然需要查看按钮。另外，我也为按钮添加了相同的代码。而且它不适用于该按钮。如果我们对按钮使用注释的代码，那么它可以工作，但是再次出现我不想要的动画。

Answer 1

好的！因此，这里找到了一种在页面加载时也控制按钮状态的解决方案。

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