Angular 2在模板渲染后执行脚本

所以我有这个使用materializecss javascript的滑块组件。所以渲染后，我需要执行

$(document).ready(function(){
    $('body').on('Slider-Loaded',function(){
        console.log('EVENT SLIDER LOADED');
        $('.slider').slider({full_width: true});
        $('.slider').hover(function () {
            $(this).slider('pause');
        }, function () {
            $(this).slider('start')
        });
    });
});

但我不太知道该行放在哪里，因为 typescript/Angular 删除了模板中的脚本标记。我已将 JQuery 包含在 ts 文件中，并希望使用事件系统，但这似乎不起作用。有任何想法吗？这是ts文件的代码：

/// <reference path="../../typings/main.d.ts" />
import {Component, Input} from 'angular2/core';
import { RouterLink } from 'angular2/router';
import {ServerService} from './server';


@Component({
    selector: 'slider',
    templateUrl:'/app/template/slider.html',
    directives: [  ],
})

export class SliderComponent {
    @Input() images;
    private server: ServerService;
    public constructor(server: ServerService){
        this.server = server;
    }

    ngOnInit() {
        console.log("THROWING EVENT");
        $('body').trigger('Slider-Loaded');
    }
}

ngAfterViewInit() of AppComponent是一个生命周期回调，Angular 在根组件及其子组件渲染后调用，它应该适合您的目的。

也可以看看https://angular.io/guide/lifecycle-hooks https://angular.io/guide/lifecycle-hooks