如何在angular2中通过选择一侧来调整div元素的大小

<div id="resizeDiv" [ngStyle]="divStyles" (mousedown)="startResize($event)"></div>

divStyles: any = {
  width: '200px',
  height: '200px'
};

startResize(event: MouseEvent) {
  event.preventDefault();
  const initialWidth = event.clientX;
  const initialHeight = event.clientY;

  const mouseMoveListener = (e: MouseEvent) => {
    const width = initialWidth - e.clientX;
    const height = initialHeight - e.clientY;

    this.divStyles.width = width + 'px';
    this.divStyles.height = height + 'px';
  };

  const mouseUpListener = () => {
    document.removeEventListener('mousemove', mouseMoveListener);
    document.removeEventListener('mouseup', mouseUpListener);
  };

  document.addEventListener('mousemove', mouseMoveListener);
  document.addEventListener('mouseup', mouseUpListener);
}