SVG 'image' tag in an external template file fails to compile

[w1ndy]

Demo: http://plnkr.co/edit/SpX3Kf74NBgBvVJTFYQF

I tried to include a template for a SVG group, which contains a defs element of several pattern, but both image and circle elements disappeared in the final SVG as inspected with Chrome. However circle elements can be properly compiled if image elements are commented out.

Is this a bug? Or did I miss something that I should be aware of when using angular on SVG? Any hint is appreciated, thanks.

[Narretz]

I assume there's a problem with the browser where it tries to parse the template content outside of the svg container. So the context isn't right and the image element gets garbled. What you can try is to either put the <svg> into the template or use a directive template, which works for some reason: http://plnkr.co/edit/GegJt1SSz4UcGgFRjiSk?p=preview

[w1ndy]

Directive template works magically, thanks.