1

我有一个 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);
}

这非常适合在悬停选项卡之后插入预览组件，但我还没有找到在悬停选项卡之前插入组件的方法。

有谁知道是否有办法使用角度动态分量来做到这一点？

谢谢你的帮助

4

0 回答 0