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

Question

是否可以在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>

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