Angular 2组件路由器 - 如何运行查看代码

Question

我正在使用组件路由器，并且路由部分工作正常。但我无法弄清楚如何运行JS来修改模板，一旦模板已经加载（而不是之前）。

例如，我想运行：

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

但显然这不能运行，直到预加载的div被加载。

这样做的最佳做法是什么？我用OnInit摆弄，但它觉得奇怪把UI修改代码在控制器中......错误......我的意思是，组件。

Answer 1

我会说，尝试css动画。

参考您的.preloader使用ElementRef：

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）做setTimeout为350毫秒，改变类的东西有transition（详情https://stackoverflow.com/a/6943704/1267942）

更新：截至Angular 2 RC4动画形状相当不错https://angular.io/docs/ts/latest/guide/animations.html（我还没试过）