在angularjs中淡出，不使用ng-animate

Question

我希望一旦复选框被选中，而不是立即消失，它淡出。

我使用了setimeout，但并不好用，而且我尽量避免使用jquery来保持干净。有可能在不使用ng-animate的情况下实现吗？

http://plnkr.co/edit/Sqo1JGCgda9ywR1OR6Me?p=preview

Answer 1

您可以使用css3

**将您的css代码修改为：**

.done-true {
  -webkit-animation: fadeOut 2s; /* Chrome, Safari, Opera */
  animation: fadeOut 2s;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes fadeOut
{
from {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
to {
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;

}
}

/* Standard syntax */
@keyframes fadeOut
{
from {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
to {
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
}
}