Angularjs使用autoUpload开始手动上传：false

Question

我正尝试使用位于in the fineuploader blog post

的角度指令教程进行手动上传

现在的工作方式是，一旦用户选择他或她想要上传的文件，它就会自动启动。

我在autoUpload: false下添加了$(element).fineUploader({ })，但我无法弄清楚如何在qq-template开始上传过程之外创建一个按钮。

有没有人有任何想法？

    //fine uploader directive
    .directive("fineUploader", function($compile, $interpolate) {
        return {
            restrict: "A",
            replace: true,

            link: function($scope, element, attrs) {
                var endpoint = attrs.uploadServer,
                notAvailablePlaceholderPath = attrs.notAvailablePlaceholder,
                waitingPlaceholderPath = attrs.waitingPlaceholder,
                acceptFiles = attrs.allowedMimes,
                sizeLimit = attrs.maxFileSize,
                largePreviewSize = attrs.largePreviewSize,
                itemLimit = attrs.itemLimit,
                allowedExtensions = $.map(attrs.allowedExtensions.split(","), function(extension) {
                    return $.trim(extension);
                });

                $(element).fineUploader({
                    debug: true,
                    request: {
                        endpoint: endpoint,
                        params: {
                            sendThumbnailUrl: !qq.supportedFeatures.imagePreviews
                        }
                    },

                    validation: {
                        acceptFiles: acceptFiles,
                        allowedExtensions: allowedExtensions,
                        sizeLimit: sizeLimit,
                        itemLimit: itemLimit
                    },

                    autoUpload: false,

                    /*
                    deleteFile: {
                        endpoint: endpoint,
                        enabled: true
                    },
                    */

                    thumbnails: {
                        placeholders: {
                            notAvailablePath: notAvailablePlaceholderPath,
                            waitingPath: waitingPlaceholderPath
                        }
                    },

                    display: {
                        prependFiles: true
                    },

                    failedUploadTextDisplay: {
                        mode: "custom"
                    },

                    /*
                    retry: {
                        enableAuto: true
                    },

                    chunking: {
                        enabled: true
                    },

                    resume: {
                        enabled: true
                    },
                    */

                    showMessage: function(message) {

                        $scope.$apply(function() {
                            $scope["errorMessage"] = message;
                        });

                        $("#errorDialog").modal("show");
                    },

                    callbacks: {
                        onSubmitted: function(id, name) {
                            var $file = $(this.getItemByFileId(id)),
                            $thumbnail = $file.find(".qq-thumbnail-selector");
                        }
                    }
                });

                $compile(element.contents())($scope);

            }
        }
    })

HTML

<div fine-uploader 
    upload-server="/uploads" 
    waiting-placeholder="/images/icons/fineuploader_loading.gif" 
    max-file-size="5000000" 
    item-limit="1" 
    large-preview-size="500" 
    allowed-mimes="image/jpeg, image/png, image/gif, image/tiff, image/bmp" 
    allowed-extensions="jpeg, jpg, png, gif, tiff, tif, bmp">
</div>

<button ng-click="uploadTheFile()">Upload me</button>

模板

<script type="text/template" id="qq-template">
    <div class="qq-uploader-selector qq-uploader">
        <div class="qq-upload-drop-area-selector qq-upload-drop-area">
            <span>Drop pdf here to upload</span>
        </div>
        <div class="qq-upload-button-selector qq-upload-button">
            <div>Upload</div>
        </div>
        <span class="qq-drop-processing-selector qq-drop-processing">
            <span>Processing dropped files...</span>
            <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
        </span>
        <ul class="qq-upload-list-selector qq-upload-list">
            <li>
              <div class="qq-progress-bar-container-selector">
                  <div class="qq-progress-bar-selector qq-progress-bar"></div>
              </div>
              <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
              <span class="qq-upload-file-selector qq-upload-file"></span>
              <span class="qq-upload-size-selector qq-upload-size"></span>
              <a class="qq-upload-cancel-selector qq-upload-cancel" href="#">Cancel</a>
              <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
            </li>
        </ul>
    </div>
</script>

我通常使用jQuery做什么

var description = "Here is some text";

var upload = $("#upload_file").fineUploader({ /* Stuff */ });

$("#button").click(function(event){
   params = { description: description };
   upload('setParams', params);
   upload('uploadStoredFiles');
});