각도 2 구성 요소 라우터 - 실행 방법보기 코드

Question

구성 요소 라우터를 사용 중이며 라우팅 부분이 잘 작동합니다. 하지만 템플릿을로드 한 후에 JS를 실행하여 템플릿을 수정하는 방법을 알아낼 수는 없습니다.

예를 들어, 내가 실행하려면 :

$(window).load(function() { 
    "use strict"; 
    $(".preloader").delay(350).fadeOut('slow'); 
}); 

을하지만 프리 로더 사업부가로드 될 때까지 분명히이 실행할 수 없습니다.

이 작업을 수행하는 가장 좋은 방법은 무엇입니까? 나는 OnInit으로 주변을 들여다 보았지만 컨트롤러에 코드를 수정하는 UI가 이상하게 느껴졌습니다 ... 잘못되었습니다 ... 구성 요소를 의미합니다.

Answer 1

나는 css 애니메이션을 시도합니다.

참조하여 .preloaderElementRef를 사용하여 :

constructor(private _el: ElementRef) { 
    this.preloader = jQuery(this._el.nativeElement).find('.preloader'); 
} 

자세한 내용은 여기 세부 정보 : How to use jQuery with Angular2?

AfterViewInit (https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html#!#afterview)에서 뭔가 할 350 ms 동안 setTimeout 변경 클래스 transition (자세한 https://stackoverflow.com/a/6943704/1267942)

을 가진

업데이트 : 각도 2 RC4 이상 애니메이션은 꽤 좋은 모양입니다 https://angular.io/docs/ts/latest/guide/animations.html (아직 시도하지는 않았습니다)