Html 如何在列出的附加文件中显示文件预览

可以在html中进行小方框文件预览吗？ 例如，我有附件列表：doc，jpeg，pdf。。。我想在每个文件标题附近显示小文件内容

以下是我迄今为止的尝试：

<div ng-repeat="attachment in vm.item.attachments" class="attachedFile" layout="row" layout-align="start center" ng-init="url = vm.showAttachment(attachment.path)">
   <div flex="5">{{attachment.user_id}}</div>
   <div layout="column" flex >
      <span class="attachmenTitle">{{attachment.path}}&nbsp &nbsp</span>
         <div class="attachedTime">{{vm.getCommentTime(attachment.timestamp)}}</div>
            <div ng-click="vm.deleteAttachment(attachment.path, vm.item._id, vm.item.container_id)" aria-label="metadata" class="deleteAttachment">
               delete
            </div>
         </div>
         <div class="attachedFilePreview" flex="10">
            <iframe id="viewer"  src={{url}}  frameborder="0" scrolling="no" width="40" height="60"></iframe>
         </div>
         <div flex="5" class="padding-left-10">
            <a  href={{url}} target="_blank" class="downloadIcon"><md-icon md-font-icon="zmdi zmdi-download"></md-icon></a>
         </div>
     </div>

{{attachment.user_id}
{{attachment.path}}
{{vm.getCommentTime（attachment.timestamp）}
删除

---

如何在iFrame中显示一些文件预览？

src={{url}}是你在

url

中的文件路径吗？如果是，你得到了什么-“不能在这里交互”我想它的

附件.url

不仅仅是

url

，还要显示你从哪里得到

url

的控制器