Уведомлять директиву об изменениях Angular2

У меня проблема, помогите решить У меня есть компонент с шаблоном

ul(slider)
    li(*ngFor="let car of getRecentCars()")
        car-poster(bcg="{{car.recentBackgroundUrl}}",  image="{{car.indexImage}}")

И направляющий ползунок

@Directive({
    selector: '[slider]'
})
export class sliderDirective{
    private el: HTMLElement;

    constructor(@Inject(ElementRef) elementRef: ElementRef) {
        this.el = elementRef.nativeElement;
        let _this = this;
        setTimeout(function(){
            $(_this.el).slick({
                infinite: false,
                slidesToShow: 1,
                slidesToScroll: 1
            });
        }, 0);


    }

}

Но директива срабатывает раньше данных в компоненте как сделать что бы можно было отложить запуск директивы отрисовки компонента


typescript angular angular2-directives angular2-components
person Ashot    schedule 20.07.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете использовать хуки жизненного цикла компонента/директивы, такие как ngAfterViewChecked:

Вот пример:

@Directive({
    selector: '[slider]'
})
export class sliderDirective{
    private el: HTMLElement;

    constructor(@Inject(ElementRef) private elementRef: ElementRef) {
        this.el = elementRef.nativeElement;
    }

    ngAfterViewChecked() {
      $(this.el).slick({
             infinite: false,
             slidesToShow: 1,
             slidesToScroll: 1
      });
    }
}

См. этот документ для более подробной информации:

person Thierry Templier    schedule 20.07.2016
comment
это не работает для меня, я попытаюсь уточнить, у меня есть служба, которая запрашивает данные и получает их отрисовки, и ползунок должен добавить к этим данным, если вы просто оставите директиву, ползунок вызывается для получения этого и начал рисовать я Понимание родительского компонента должно вызвать событие, что он получил данные и начал рисовать, а затем должен запустить директиву скрипта. - person Ashot; 21.07.2016