动画结束后，AngularJS动画项目重新出现

Question

我遇到了一个我似乎无法弄清楚的问题。我正在为ng-hide上的项目制作动画。显示元素时动画运行正常，但隐藏元素时，元素会在消失之前再次显示。

.spinner-container.ng-hide-remove {
    animation: splat-in 1s linear forwards;
}

.spinner-container.ng-hide-add {
    animation: splat-out 1s linear forwards;
}

元素本身：

<div class="row spinner-container" ng-hide="fadeOut">
    <div class="spinner"></div>
</div>

这是a Plunkr illustrating the problem。