html
<div
  (click)="flip()"
  class="animate__animated cursor--pointer"
  [ngClass]="{ animate__flipInX: isFlipped }"
>
  <div *ngIf="!isFlipped">正面</div>
  <div *ngIf="isFlipped">背面</div>
</div>component.ts
 isFlipped: boolean = false;
  flip() {
    this.isFlipped = !this.isFlipped;
    
  }安装插件
在angular.json中使用
"styles": [
              "node_modules/animate.css/animate.min.css",
              "src/styles.scss",
            
            ],以上:从正面翻转到背面看得到翻转,但从背面翻转到正面
如果加上另一个方向翻装,div会消失