Polymer Core-ajax文件上傳進度

Question

如何添加進度欄。 我在這里使用eric bidelman提供的代碼=> Polymer Core-Ajax文件上傳

downloadinit: function( event, detail, sender ){
            this.files = sender.files;
            for ( var i = 0; i < this.files.length; i++ ) {
                var file = this.files[i]
                this.uploadsize += file.size;
                this.fileList[this.uploadPop] = file.name;
                this.uploadPop += 1;
            }

            event.stopPropagation(); // Stop stuff happening
            event.preventDefault(); // Totally stop stuff happening

            for( var i = 0, f; f = this.files[i]; ++i) {
                this.data.append( sender.name, f, f.name );
            }
            this.queryUrl2 = "projects/submit.php?pjid="+this.projDetails.projectid;
            this.submitBody = this.data;
            this.$.ajaxAction2.contentType = null;
        },
        triggerDownload: function(){
            this.$.ajaxAction2.go();
            data = new FormData;
            this.files = null;
            this.fileList = [];
            this.submitBody = null;
            this.uploadsize = 0;
            this.uploadPop = 0;
        },

Answer 1

您可以添加“加載”蒙版。

<template>
<form>
   <paper-input type="File" label="Choose File" ... ></paper-input>
   <paper-button label="Send" on-click="{{sendData}}" raisedButton></paper-button>
</form>
<core-ajax id="ajax" url="/upload"
           method="POST"
           on-core-response="{{onResponse}}"
           ....
></core-ajax>
</template>
<script>
sendData: function () {
    ...
    this.$.ajax.go();
    this.spiningLoadingMask(true);
    ...
},

onResponse: function () {
    ...
    this.spiningLoadinMask(false);
    ...
},

spiningLoadingMask: function (val) {
    if(val){
    ... //start moving the wheel
    } else {
    ... //stop that wheel
    }
}
</script>

像這樣的東西可以工作，沒有“進度條”，但是旋轉輪是一個不錯的選擇。

Answer 2

有一個請求請求實現了缺少的功能https://github.com/Polymer/core-ajax/pull/27