角度ng-show無法在隱藏動畫

Question

我將Angular動畫懸停在此li上，它在buttonHolder類的顯示上進行動畫處理， 但不在mouseleave上進行動畫處理。 它只是消失了。

<li class='notifyItem' ng-repeat="product in notify.notifications" ng-mouseenter="notify.showButtons(product)" ng-mouseleave="notify.showButtons(product)">

這是函數：

this.showButtons = function(idx) {

            idx.buttonShow = !idx.buttonShow;
        };

這是動畫的按鈕：

<button ng-show='product.buttonShow' class='buttonHolder caseButton btn-mini'>Create Case</button>

這是CSS：

.buttonHolder.ng-hide-remove {
height: 0;
transition: height .1s;}

.buttonHolder.ng-hide-remove.ng-hide-remove-active {
height: 25px;}

僅供參考，我從以下網站獲得了有關動畫的信息： http : //www.yearofmoo.com/2013/08/remastered-animation-in-angularjs-1-2.html

Answer 1

這是我最終添加的內容，以使其正常運行：

.buttonHolder.ng-hide-add { height: 25px; transition: height .08s; }  
.buttonHolder.ng-hide-add-active { height: 0; } 

當我僅使用ng-show時，似乎同時使用了ng-hide和ng-show。 因此，需要兩組類都可以使動畫同時出現。