在ionic/angular中使用svg提示以下错误

EXCEPTION: Template parse errors: Can't bind to 'xlink:href' since it isn't a known native property

html代码如下：

<svg role="img" class="icon">
    <use [xlink:href]="iconname"></use>
</svg>

出现错误的原因是是 svg没有property,所以需要绑定attribute。

至于attribute和property的区别，大家可以课下去补习一下。

解决方案

<svg role="img" class="icon">
    <use [attr.xlink:href]="iconname"></use>
</svg>

或者

<svg role="img" class="icon">
    <use attr.xlink:href="{{iconname}}"></use>
</svg>