角2：HTML要素の位置を取得する

Question

私は任意のHTML要素を動かすために角2でカスタムディレクティブを実装しようとしています。これまでのところ、HTML要素をクリックして移動を開始したいときに、HTML要素の初期位置を取得する方法は今のところありません。私はそれらの2つのホストのバインディングと私のHTML要素のtopとleftスタイルに結合しています：

/** current Y position of the native element. */ 
@HostBinding('style.top.px') public positionTop: number; 

/** current X position of the native element. */ 
@HostBinding('style.left.px') protected positionLeft: number; 

問題は、それらの両方が先頭にundefinedであるということです。 HTML要素を更新する値だけを更新することはできますが、それを読み取ることはできません。そういうことだろうか？そしてもしそうなら、私はHTML要素の現在の位置を取得する必要があります。

Answer 1

<div (click)="move()">xxx</div> 

// get the host element 
constructor(elRef:ElementRef) {} 

move(ref: ElementRef) { 
    console.log(this.elRef.nativeElement.offsetLeft); 
} 

もhttps://stackoverflow.com/a/39149560/217408