Not able to understand and get x and y position wrt to parent of a translated child element(angular)

I have created a directive where I am using host listener to calculate the position of the element being dragged , however I also want to get the x and y(top and left positions) of the placed child element wrt to parent.

position: Position = {x: 0, y: 0};

 @HostListener('dragStart', ['$event'])
    onDragStart(event: PointerEvent) {
       this.startPosition = {
        x: event.clientX - this.position.x,
        y: event.clientY - this.position.y
    }
     console.log("ondragstart")
  }

  @HostListener('dragMove', ['$event'])
   onDragMove(event: PointerEvent) {
     this.position.x = event.clientX - this.startPosition.x;
     this.position.y = event.clientY - this.startPosition.y;
 }

I have the values of this.position.x, this.position.y but I think it will be wrt to window if I am not wrong.(if it is wrt to the immediate parent container element then my problem is solved) Please help me with this. Thanks!

Source: New feed
Source Url Not able to understand and get x and y position wrt to parent of a translated child element(angular)