Angular Dynamic Component，在另一个组件之前插入

Question

我有一个Angular7应用程序，用户可以在其中拖放表格的选项卡。当我们将标签拖到另一个选项卡上时，我想在悬停的选项卡之后或之前插入（取决于所拖曳的选项卡与悬停的位置相比），预览组件，它只是一个带有小的HTML块的组件指示将标签放到哪里。

我为此使用动态组件，在选项卡上有Dragenter事件，在该选项卡上，我致电创建动态组件的服务。

DragEnter事件在选项卡上：

private dragEnterElement = (e: DragEvent): void => {        
 this.dragService.setRootViewContainerRef(this.dragElementviewContainerRef);
 this.dragService.addDynamicComponent();
}

服务：

public setRootViewContainerRef = (viewContainerRef): void => {
    this.rootViewContainer = viewContainerRef;
}

public addDynamicComponent = (): void => {
    const factory = this.factoryResolver.resolveComponentFactory(PreviewDragTabComponent);
    const component = factory.create(this.rootViewContainer.parentInjector);
    this.rootViewContainer.insert(component.hostView);
}

在将鼠标悬停在选项卡之后插入预览组件的效果很好，但是我还没有找到在悬停的选项卡之前插入预览组件的方法。

有人会知道是否有一种方法可以利用角动态分量吗？

感谢您的帮助