Angular 页面添加竖线条,用原生js实现_前端

Angular 页面添加竖线条,用原生js实现_前端_02

Angular 页面添加竖线条,用原生js实现_前端_03


 

ngAfterViewInit() {
  const sourceElements = document.querySelectorAll('.script-input-container .script-left-context');
  const targetElements = document.querySelectorAll('.script-input-container .mini-header');

  sourceElements.forEach((sourceElement, index) => {
    const targetElement = targetElements[index] as HTMLElement;

    if (sourceElement && targetElement) {
      const sourceHeight = (sourceElement as HTMLElement).clientHeight;
      const sourcLeft = (targetElement as HTMLElement).clientWidth + 53;
      targetElement.style.height = `${sourceHeight}px`;
      targetElement.style.marginLeft =  `-${sourcLeft}px`;
    }
  });
}