I've been writing Angular for a long time, and I have a possible use for something I've never needed before! But I don't know if it's safe.
Is it OK to move the native DOM element of a component around after it has been created? Not via ViewRef or things like that, but the raw DOM element. I tried it, and so far it seems to work. Here is a stackblitz that moves a component's host element in the DOM, and input bindings still work.
So, it seems to be OK at a glance, but is this supposed to work (and will continue working in future version of Angular) or does it happen to work (and may break without warning)?
In that example, imagine "app-svg-team" is written by one team within the company, and wants to create many little components that all cooperate with each other, but can be displayed anywhere on the page the "core team" chooses. This would be a way to let the core team handle laying out individual components from multiple teams. Each team's components could inject services provided by their top-level "team component" even though they may end up in completely unrelated parts of the DOM.