并排显示文件名并固定窗口大小

时间:2018-06-25 03:58:29

标签: html css angularjs twitter-bootstrap

我正在研究angularjs和bootstrap css。我正在尝试固定窗口的高度,当通过单击Upload file按钮上传多个文件时,窗口的大小也越来越大,我想并排显示所选文件的名称,而不是显示每个文件的名称当选择文件并要固定窗口大小时,文件名以不同的行显示(演示中当前在演示中显示),当上传更多文件时,我们可以仅在文件名上显示滚动条而不增加窗口大小吗?

演示:https://plnkr.co/edit/enIZfA1hYD23vvSWn2NJ?p=preview

示例代码:

     <div ng-controller="ModalInstanceCtrl">
    <form name="headerForm">
    <div class="modal-body">
     <div class="modal-dialog">
     <div class="modal-content">
    <br><div> <input type="file" id="fileUpload" ng-file-model="files" multiple />
       <div class="btn"><span id='button' ng-click="$event.stopPropagation();clickOnUpload();">Upload File</span></div>
         <span ng-if="filesToUpload.length > 0">{{filesToUpload.length}} file<span ng-if="filesToUpload.length > 1">s</span> selected</span>
         <p ng-repeat="file in filesToUpload track by $index">
          {{file.name}} <span class="delete-file" ng-click="deleteFile($index)">X</span>
        </p></div>
      <textarea rows="20" maxlength=35000 name="message"  ng-model="message" ></textarea>
        <button type="button" ng-click="cancelModal()">Close</button>
        </div>
        </div>
        </div>

</form>
</div>

0 个答案:

没有答案