Javascript 当ng显示值等于false时的AngularJs动画

在我的代码中，当ng show true时，我将显示警报消息。我正在使用css制作动画。当ng显示true“requiredErrorBlock”类并从右向左显示div时，工作正常。我需要添加一些css，当ng show变为false时使用。动画应该从左到右删除div。我可以知道如何在我的代码中这样做吗

Html

---

您可以尝试使用ng类属性，在这里您可以有条件地应用css类

<div ng-class="{'requiredErrorBlock':isRequiredFiledsMissing == true && isSubmited && 
               form_Quote_cusPlan.$invalid}" 
     ng-show="isRequiredFiledsMissing == true && isSubmited && 
              form_Quote_cusPlan.$invalid">
    <span>
       <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color: #ffffff !important;"></i>
    </span> 
    Required fields Can not be empty.
</div>

必填字段不能为空。

通过将ng class和ng show中的条件分配给相应JS控制器中的$scope变量，并使用该新变量代替条件，可以使代码更简洁

如果这就是你要找的，一定要告诉我。如果没有，请提供代码笔演示

@-webkit-keyframes leftToRight {
    from {
        margin-left: 100%;
        height: 52px;
        width: 0%
    } to {
              margin-left: 0%;
    width: 100%;
      }
}

.requiredErrorBlock{
    position: fixed;
    bottom: 0px;
    left:0;
    width: 100%;
    z-index: 100000;
    color: #ffffff;
    background-color: #ed0039;
    padding: 15px;
    -webkit-animation: 0.9s leftToRight;
}

<div ng-class="{'requiredErrorBlock':isRequiredFiledsMissing == true && isSubmited && 
               form_Quote_cusPlan.$invalid}" 
     ng-show="isRequiredFiledsMissing == true && isSubmited && 
              form_Quote_cusPlan.$invalid">
    <span>
       <i class="fa fa-exclamation-triangle" aria-hidden="true" style="color: #ffffff !important;"></i>
    </span> 
    Required fields Can not be empty.
</div>