Dom 如何在angular 2中更新ElementRef？

我在使用dynamicComponentloader加载组件时遇到问题。我有一个父组件和三种子组件

首先，我使用Interact.js将子组件A和子组件B拖动到parentcomponent中。如下所示

Component A
Component B

Component B
Component A
Component C

我使用的方法是LoadInLocation..，elementRef。。。然后我像这样改变他们的位置

Component B
Component A

改变位置后，我会将第三个组件拖到parentcomponent中，我认为它应该插入parentcomponent的底部，如下所示

Component A
Component B

Component B
Component A
Component C

但实际上，第三个组件被插入到位置组件A和组件B中

Component B
Component C
Component A

我已将此示例作为plnkr

我认为导致这个问题的原因是我更改了DOM，但没有将更改映射到elementRef。所以我正在寻找更新elementRef的方法，希望它能解决我的问题

---

有什么建议可以解决这个问题，或者有什么方法可以改变两个组件的角度位置？

我已经玩了一段时间了

首先，我保存被注入组件的引用，以便以后使用它们

实例：[]=[]； 阿达布{ this.loader.loadInLocationComponentA，this.elementRef，容器 .thenr=>this.instances.pushr； this.loader.loadInLocationComponentB，this.elementRef，容器 .thenr=>this.instances.pushr； } 返回一个承诺，该承诺解析为，这就是我在数组中保留的内容

现在，当我们交换它们时，我取第一个，我重新插入它，当它正确解析时，我删除第一个引用。更清楚的是：插入A和B，再次插入A，删除第一个A

换位{ //就拿第一个吧 设first=this.instances[0]； //重新插入第一个 this.loader.loadInLocationFirst.hostComponentType，this.elementRef，容器 .then \=>first.dispose；//dispose销毁上一个实例 } 这就是你所需要的。插入组件C是相同的，不需要更改。就像我在gitter中告诉你的，我认为它在内部跟踪位置，你在angular2不知道的情况下操纵DOM这是基于其行为的纯粹猜测，显然需要调查。这是我得到的最有角度的方法，所以我希望它能帮助你

---

这是一个关于您的案例的解决方案。

@r2\u d2感谢格式改进。此解决方案适用于特殊指定的contidion，如更改最后两个子组件的位置。但如果我有四个或更多的子组件A、B、C、D，并想改变B&C的立场。这行不通。不是吗？条件越多，逻辑就越强。是的，这个答案是针对您所问的用例的，因此如果问题后面有更多的内容，您将不得不进一步了解逻辑，但是您已经向前迈出了一步，现在您需要处理一些东西：DSure。你已经给了我一个方向，我会继续努力。你的回答给了我很多关于ng2的信息，我甚至不知道loadIntoLocation可以返回承诺XD。也许我应该做更多的关于源代码的研究，因为文档还没有完成。似乎这种方法有问题。在此用例中，我必须在实例中使用配置。但是，当您处理上一个实例时，我将丢失其中的所有信息。我已通过替换promise in changePosition方法中的uz.instance.config=this.instances[0].instance.config等配置来解决此问题：