2014-03-19 2 views
0

경로가 변경되면 두 div간에 애니메이션을 적용하려고합니다.AngularJS - 부모 div가 ngShow를 사용하여 애니메이션을 재생하면 ngView가 사라집니다.

ng-show와 ngAnimate를 사용하여 지금까지 제대로 작동하지만 두 번째 div에는 경로가 변경되면 즉시 사라지는 ng-view가 포함되어 있습니다. DOM에서 ng-view를 제거하기 전에 ng-show 애니메이션이 완료 될 때까지 어떻게 대기해야합니까?

라이브 데모 : http://run.plnkr.co/7RLwUxwfUV4rb2kV/#/

샘플 코드 : 당신은 당신의 CSS에서 ng-show 애니메이션되지만 ng-view 콘텐츠를 전환 할 때 애니메이션하지 않을 http://plnkr.co/edit/0ZatzKRKAyxUUfgslxum?p=preview

답변

0

. .ng-enter.ng-leave css 클래스로 ng-view에 애니메이션을 적용합니다. 여기에 예제가 있습니다.

+0

ngView에 애니메이션 클래스를 추가 한 후에도 동일한 문제가 계속 발생합니다. http://plnkr.co/edit/0ZatzKRKAyxUUfgslxum?p=preview – matthoiland

+0

''/ ''에 대한 경로에 템플릿이 없기 때문입니다. Angular는 라우트가 그 경로를 가지고 있지 않다는 것을 알 때 DOM으로부터'ng-view' 엘리먼트를 제거하고 템플리트가있는 라우트가 히트 될 때 그것을 다시 생성합니다. –

+0

나는 그 생각을 좋아하지만, 여전히 그 견해를 즉시 제거하고있다. http://plnkr.co/edit/0ZatzKRKAyxUUfgslxum?p=preview – matthoiland

관련 문제