Usando Angular 12.

Estoy creando múltiples superposiciones a partir de componentes:

 this.currentComponents.map((component, index) => { const positionStrategy = ... const ref = this.overlay.create({positionStrategy}); const att = ref.attach(new ComponentPortal(component)}; this.drag.createDrag(ref.overlayElement, dragConfig).withBoundaryElement...;

Esto crea una fina superposición que se puede arrastrar y flotar libremente. Tiene un componente dentro que funciona bien.

En carga, creamos dos de estos que funcionan bien. Ambos son elementos que se pueden arrastrar en la página, sin embargo, el segundo siempre se coloca sobre el primero. ¿Cómo reordeno estos elementos?

Básicamente, cuando arrastro el elemento A, debería ir a la parte superior. Cuando arrastro el elemento B, debería ir a la parte superior.