AngularJS错误：[$ interpolate：noconcat]与SVG

Question

Angular的新手（1.6.1）。试着做这样的事情：

<li ng-repeat='thing in list'>
<svg class="icon" aria-hidden="true"><use xlink:href="#icon-{{ thing.icon }}"></use></svg>
</li>

基本上我想根据“thing.icon”的值来确定使用哪个SVG精灵。

但是Angular给了我“错误：[$ interpolate：noconcat]”，它说是针对XSS的安全保护：https://docs.angularjs.org/error/ $ interpolate / noconcat

关于如何避免这种和/或更好的方法的任何想法？谢谢！

Answer 1

我也遇到了这个问题，通过添加ng-href内容xlink:href同时保留xlink:href为空来解决此问题。通过mathewbyrne在此问题上的解决方法：https://github.com/angular/angular.js/issues/7697

所以试试：

<li ng-repeat='thing in list'>
<svg class="icon" aria-hidden="true"><use ng-href="#icon-{{ thing.icon }}" xlink:href=""></use></svg>
</li>