Question

我有一个组件，该组件嵌套在Angular 6应用程序的组件HTML树中。它的一部分是固定的，应该填充整个视口。不幸的是，其祖先元素之一已应用了变换，这导致固定位置相对于变换后的祖先元素而不是视口固定。

什么是将此固定元素移动为document.body的直接子代的Angular友好方法，这样该组件的生命周期仍然可以正确运行，并且我能够将组件声明保持在当前的层次结构位置在？

如果问题不明确-

我要从这里开始，将id =“ fixed-backdrop”的元素移到body元素的直接子元素中，这样变换后的父元素不会影响固定位置，同时仍要确保Angular组件some-child-component类仍然可以访问元素并在destroy上清除它：

<body>
   <app-root>
    <some-transformed-parent-component>
       <some-child-component>
           <div id="fixed-backdrop"></div>
       </some-child-component>
    </some-transformed-parent-component>
   </app-root>
</body>

目标：

<body>
  <app-root>
    <some-transformed-parent-component>
       <some-child-component>

       </some-child-component>
    </some-transformed-parent-component>
  </app-root>
    <!-- Still managed by some-child-component -->
    <div id="fixed-backdrop"></div>
</body>

将Angular 6中组件的渲染模板移动到body元素的正下方？

0 个答案: