Angular 2如何加载SVG图像？

我在Angular 2模板中尝试了以下代码：

<ul class="products">
  <li *ngFor="#p of products">
    <svg width="200" height="100" xmlns="http://www.w3.org/2000/svg"
         xmlns:svg="http://www.w3.org/2000/svg"
         xmlns:xlink="http://www.w3.org/1999/xlink">
         <g>
            <title>{{p.Name}}</title>
            <image xlink:href="http://somewhere.com/{{p.Picture1}}"
                   id="svg_21" height="176.731579" width="117" y="28" x="32" />
        </g>
    </svg></li></ul>

---

但是在使用该选项的过程中，我得到了一个错误：找不到

我的应用程序

在发布问题几秒钟后，我找到了答案：

<image *ngIf="p.Picture1" attr.xlink:href="http://somewhere.com/{{p.Picture1}}" />

显然，如果

p.Picture1

为空，则更有可能使html或SVG无效，从而导致找不到

my app

，如下所示

attr.xlink:href="http://somewhere.com/{{p.Picture1}}"

<image *ngIf="p.Picture1" attr.xlink:href="http://somewhere.com/{{p.Picture1}}" />