2016-07-05 2 views
2

У меня есть директива, которая добавляет количество пикселей, соответствующих его родительского right CSS атрибутAngular2 атрибут CSS просмотр через родителей

import { Directive, ElementRef, AfterViewInit } from "angular2/core" 

@Directive({ 
    selector: "[d]" 
}) 
export class PositioningFromParent implements AfterViewInit { 
    private el:HTMLElement 

    constructor(el: ElementRef) { 
     this.el = el.nativeElement 
    } 

    ngAfterViewInit() { 
     let v = this.el.parentNode.getBoundingClientRect().right 
     this.el.style[left] = v + "px" 
    } 
} 

Он работает просто отлично. Однако, если я изменяю размер моего окна, мой родитель меняется и его значение right. Моя директива не корректирует это значение в минуту. Как я могу посмотреть значение this.el.parentNode.getBoundingClientRect().right в Angular2?

Благодаря

ответ

2

Слушайте, чтобы изменить размер и обновление, когда событие вызывается:

@Directive({ 
    selector: "[d]" 
}) 
export class PositioningFromParent implements AfterViewInit { 
    private el:HTMLElement 

    constructor(el: ElementRef) { 
     this.el = el.nativeElement 
    } 

    ngAfterViewInit() { 
     this.updateLeft(); 
    } 

    @HostListener('window:resize') 
    updateLeft() { 
     let v = this.el.parentNode.getBoundingClientRect().right 
     this.el.style[left] = v + "px" 
    } 
} 

angular2: How to use observables to debounce window:resize Смотрите также ограничить скорость код выполняется во время изменения размера.

Смежные вопросы