发表于: 2017-07-24 23:38:42

1 819


今天完成的事情:公司新增的三个图片上传服务以及表单的补全。

明天计划的事情:完成新增公司页面,编辑页面,以及职位页面。

遇到的问题:在插件上花费了大量的时间。

收获:图片上传插件的使用。

github地址:https://github.com/nervgh/angular-file-upload;

官方api:https://github.com/nervgh/angular-file-upload/wiki/Module-API;

使用方法:

    //图片上传配置

    var uploader = vm.uploader = new FileUploader({

        url: "/carrots-admin-ajax/a/u/img/task",

        queueLimit: 1

    });

   uploader.onAfterAddingFile = function(fileItem) {

        vm.fileItem = fileItem._file;

    };

    uploader.onSuccessItem = function(fileItem, response, status, headers) {

        vm.logo = response.data.url;

    };




                           <label for="choosePicture"

                                <input id="choosePicture" type="file" nv-file-select uploader="vm.uploader">

  <img style="max-height: 150px;max-width: 600px;" ng-src="{{vm.logo}}" alt="配图预览">

        <tr ng-repeat="item in vm.uploader.queue">

                                                <td ng-bind="item.file.name"></td>

                                                <td>

                                                    <span ng-bind="item.file.size/1024/1024|number:2"></span>MB

                                                </td>

                                                <td>

                                                    <div

                                                        <div "{'width':item.progress+'%'}" ng-bind="item.progress+'%'"></div>

                                                    </div>

                                                </td>

                                                <td>

                                                <span ng-show="item.isSuccess" style="display: none;"><i

                                                <span ng-show="item.isCancel" style="display: none;"><i

                                                <span ng-show="item.isError" style="display: none;"><i

                                                </td>

                                                <td>

                                                    <button type="button" "item.upload()" ng-disabled="item.isReady || item.isUploading || item.isSuccess"><span

                                                    <button type="button" "item.remove()"><span

                                                    </td>

                                            </tr>



返回列表 返回列表
评论

    分享到