小编OvS*_*eep的帖子

嗨我开始使用Angular 2并试图使这个carousel插件工作:光滑

过了一会儿,我设法让它像这样的组件一样工作:

import { Component, Input, ElementRef, AfterViewInit, AfterContentInit} from '@angular/core';
declare var jQuery: any;

@Component({
    selector: 'slick-slider',
    template: `
        <ng-content></ng-content>
    `
})
export class SlickSliderComponent implements AfterContentInit{
    @Input() options: any;

    $element: any;

    defaultOptions: any = {};

    constructor(private el: ElementRef) {
    }

    ngAfterContentInit() {
        for (var key in this.options) {
            this.defaultOptions[key] = this.options[key];
        }

        this.$element = jQuery(this.el.nativeElement).slick(this.defaultOptions);
    }
}

我会在模板上使用它:

<slick-slider>
    <div><img class="btn btn-lg" src="/assets/img/img1.png" /></div>
    <div><img class="btn btn-lg" src="/assets/img/img2.png" /></div>
    <div><img class="btn btn-lg" src="/assets/img/img3.png" /></div>
    <div><img class="btn …