用于md按钮的动画隐藏动画无法正常工作

Question

我有简单的css动画效果：

.sample-show-hide {
    -webkit-transition:all linear 1.5s;
    transition:all linear 1.5s;
}

.sample-show-hide.ng-hide {
    opacity: 0;
}

.sample-show-hide.ng-show {
    opacity: 1;
}

我尝试用它为md-button制作动画。动画很适合展示，但在隐藏时没有任何效果。当我更改为简单<button>标记时，动画适用于show / hide。有办法解决吗？

Answer 1

ng-hide拥有属性transition: none，请使用以下css

.sample-show-hide {
    -webkit-transition:all linear 1.5s  !important;
    transition:all linear 1.5s !important;
}

check on jsfiddle