Question

我有一个提供ajax帖子的余烬服务

import Ember from 'ember';
import ENV from '../config/environment';

export default Ember.Service.extend({
  save(data) {
    return new Ember.RSVP.Promise(
      function (resolve, reject) {
        function progress(e){

          if(e.lengthComputable){
            let max = e.total;
            let current = e.loaded;
            let Percentage = (current * 100)/max;
            console.log(Percentage);
            if(Percentage >= 100)
            {
              // process completed
            }
          }
        }

        Ember.$.ajax({
          type: 'POST',
          enctype: 'multipart/form-data',
          url: ENV.APP.API_HOST + '/profile/lampiran-desas',
          processData: false,
          contentType: false,
          cache: false,
          data: data,
          xhr: function() {
            let myXhr = $.ajaxSettings.xhr();
            if(myXhr.upload){
              myXhr.upload.addEventListener('progress',progress, false);
            }
            return myXhr;
          },
          success: function (response) {
            resolve(response);
          },
          error: function (error) {
            reject(error);
          }
        });
      });
  }
});

成功响应通常在我的组件中返回。但是如何让我的功能进步回归。所以我可以在我的模板上制作加载进度条..？

感谢..

Answer 1

据我所知，您正在服务中进行远程调用，并希望在组件中显示进度。为此，您需要在服务本身中保存相关数据;并显示组件中的进度。

以下是我为您准备的twiddle来说明此案例。 mock-remote-call-service是一个模拟服务，每200毫秒更新一次进程10％。结果直接保存到服务本身。 progress-displayer-component有责任显示进度，启动远程调用任务，甚至显示返回的数据。

这只是一个模拟的例子来解释我的观点。我希望这会有所帮助。

在ember ajax服务中获取xhr返回函数

1 个答案: