子 svg 要素である動的コンポーネントを挿入することは可能ですか?
たとえば、メイン コンポーネント (CanvasComponent) があり、そのテンプレートは次のようなものです
<svg width="400" height="400">
<ng-template appCanvasAnchor></ng-template>
</svg>
その ng-template は、https://angular.io/guide/dynamic-component-loaderに従ってコンポーネントを動的に注入するために使用されるアンカーです
動的 (SquareComponent) にはこのテンプレートがあります
<svg:rect width="100" height="100" style="fill:red" />
ここで、動的コンポーネントが DOM に追加される方法により、Square コンポーネントが DOM に追加されると、以下のような div 要素に含まれます。
<svg width="400" height="400">
<div app-square>
<rect width="100" height="100" style="fill:red" />
</div>
</svg>
理論的には、これが SVG であるという事実を除いて、すべてがうまく機能するため、未知のマークアップ (div) があるため、私の正方形はレンダリングされません。ここでの質問は、インジェクターが使用する要素を変更して、div を使用するのではなく、g のような要素を使用して svg を認識できるようにすることはできますか?