요소가 AngularJS에서 표시 될 때 일부 DOM 조작 실행

Question

일부 요소가 표시 될 때 일부 코드를 숨길 때 우아하게 실행할 수 있습니까? 스 와이프 할 수있는 스크롤 영역을 단일 페이지 앱에 여기 저기 적용하고 요소가 표시 될 때만 가능합니다.

Answer 1

각도 1.1.4는 프레임 워크에 애니메이션 지원을 추가했습니다. 자세한 내용은 here을 참조하십시오.

질문에있는 정보를 기반으로하지 않을지라도 css3 전환을 사용하여 효과를 얻을 수 있습니다.

<div data-ng-hide="hidden == true" data-ng-animate="'myAnimation'"> 
    ... 
</div> 
<div data-ng-show="hidden == false" data-ng-animate="'myAnimation'"> 
    ... 
</div> 

...

//you can inject stuff! 
myModule.animation('myAnimation-show', ['$rootScope', function($rootScope) { 
    return { 
    setup : function(element) { 
     //this is called before the animation 
    }, 
    start : function(element, done, memo) { 
     //this is where the animation is expected to be run 
    } 
    }; 
}]); 

myModule.animation('myAnimation-hide', ['$rootScope', function($rootScope) { 
    return { 
    setup : function(element) { 
     //this is called before the animation 
    }, 
    start : function(element, done, memo) { 
     //this is where the animation is expected to be run 
    } 
    }; 
}]); 

편집 :

는 예를 들어 here를 참조하십시오 또는 당신은 NG 쇼/NG 숨기기에서 실행되는 자바 스크립트에서 애니메이션을 만들 수 있습니다.