アニメーションは蹴りでないNG-表示/非表示

Question

編集

は、いくつかのクラスを追加しましたが、私はまだ何か

$duration = .3s 
.fade 
    transition $duration linear all 
    &.ng-enter 
    opacity 0 
    transition-delay $duration 
    &-active 
     opacity 1 
    &-hide 
    opacity 1 
    &.ng-hide 
     opacity 0 
     transition-delay $duration 

    &.ng-leave, &.ng-hide-remove 
    opacity 1 
    &-active 
     opacity 0 

を欠けていることは、今作品ではなく、正しい方法で

---

のは、私はこの単純なアニメーションを

animation.s持っているとしましょうtylus

$duration = .3s 
.fade 
    &.ng-enter 
    transition $duration linear all 
    opacity 0 
    transition-delay $duration 
    &-active 
     opacity 1 

    &.ng-leave 
    transition $duration linear all 
    opacity 1 
    &-active 
     opacity 0 

animation.css

.fade.ng-enter { 
    -webkit-transition: 0.3s linear all; 
    transition: 0.3s linear all; 
    opacity: 0; 
    -webkit-transition-delay: 0.3s; 
      transition-delay: 0.3s; 
} 
.fade.ng-enter-active { 
    opacity: 1; 
} 
.fade.ng-leave { 
    -webkit-transition: 0.3s linear all; 
    transition: 0.3s linear all; 
    opacity: 1; 
} 
.fade.ng-leave-active { 
    opacity: 0; 
} 

私は何をしないのですか？これはng-viewで動作しますが、ng-show/hideでは動作しません。働くためには

Answer 1

、NG-ショー（とngの非表示）は、追加の明示的なCSS（またはJS）を必要とするルール、ここで彼らは、次のとおりです。

.fade 
    &.ng-hide-add 
    opacity 1 
    &-active 
     opacity 0 
     display none 
    &.ng-hide-remove 
    opacity 0 
    &-active 
     opacity 1