如何使用[src]在Angular 2中动态显示图像？

我试图动态显示图像，但不幸的是我一直不成功。如何使用[src]在Angular 2中动态显示图像？

这里是我当前的html代码：

<article class="panel panel-default"> 
    <div class="panel-body"> 
     {{ content.file }} 
    </div> 
    <img [src]="content.file" class="img-thumbnail" alt="Can't Display Image" width="304" height="236"> 
    <footer class="panel-footer"> 
     <div class="author"> 
      {{ content.username }} 
     </div> 
     <div class="config" *ngIf="belongsToUser()"> 
      <a (click)="onEdit()">Edit</a> 
      <a (click)="onDelete()">Delete</a> 
     </div> 
    </footer> 
</article>

这里就是我得到当我使用[src]=content.file

不过，我仔细检查了该content.file有正确显示图像的相对路径。

当我硬编码使用的链接：<img src="../../../uploads/file-1491707047047.jpg" class="img-thumbnail" alt="Can't Display Image" width="304" height="236">代替时，得到的图像显示（我字面上从控制台content.file字段复制）。