Tengo este control deslizante personalizado

https://stackblitz.com/edit/angular-ivy-airvm5?file=src/app/app.component.css

En los botones Siguiente y Anterior, las imágenes obtienen cambios de la matriz de images , pero el problema principal es cuando hacemos clic en el botón Siguiente mientras traducimos la posición del botón siguiente y anterior se cambia a la parte superior, pero aquí quiero cuando traduzco, ya que las diferentes diapositivas tendrán una altura diferente. de imágenes, por lo que el botón siguiente y anterior deberían posicionarse automáticamente de acuerdo con la altura de las imágenes. Estaba tratando de dar margen superior también

 let currentMargin = parseInt(this.nextdiv.nativeElement.style.marginTop); if(isNaN(currentMargin)){ currentMargin = 0; } let newMargin = currentMargin + 70; this.next.nativeElement.style.marginTop = newMargin+'px';

captura de pantalla:

alguna solucion gracias