Angular 2: Position des HTML-Elements abrufen

Question

Ich versuche eine benutzerdefinierte Anweisung in Angular 2 zu implementieren, um ein beliebiges HTML-Element zu verschieben. Bis jetzt funktioniert alles außer, dass ich jetzt nicht wie ich die anfängliche Position des HTML-Elements bekomme, wenn ich darauf klicke und mich bewegen möchte. Ich Bindung an die top und left Designs von HTML-Element mit diesen beiden Host-Bindungen:

/** 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; 

Das Problem ist, dass beide von ihnen sind undefined am Anfang. Ich kann nur die Werte aktualisieren, die auch das HTML-Element aktualisieren, aber ich kann es nicht lesen? Soll das so sein? Und wenn ja, welche Alternative muss ich die aktuelle Position des HTML-Elements abrufen.

Answer 1

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

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

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

Siehe auch https://stackoverflow.com/a/39149560/217408