将参数传递给XMLHttpRequest eventListener函数

时间:2014-04-30 13:27:16

标签: javascript angularjs

我有一个带有文件上传屏幕的angularjs应用程序。

为了监控文件上传的进度,我已经注册了'progress'事件处理程序,如下所示:

xhr.upload.addEventListener("progress", uploadProgress, false);

我的功能:

  function uploadProgress(evt) {
        $scope.$apply(function(){
            if (evt.lengthComputable) {
                $scope.data.progress[0] = evt.loaded;
            } else {
                $scope.data.progress = 0;
            }
        })
    }

我需要再传递一个参数到uploadProgress方法。 我怎样才能实现这一目标?

基本上是一个额外的参数说'我'喜欢这个:

xhr.upload.addEventListener("progress", uploadProgress(i), false);

1 个答案:

答案 0 :(得分:6)

这不是特定于角度的。

您可以使用标准JS的 bind()

function uploadProgress(i, evt) {
    ...

xhr.upload.addEventListener("progress", uploadProgress.bind(null, i), false);

您可以使用Angular的 angular.bind()

function uploadProgress(i, evt) {
    ...

xhr.upload.addEventListener("progress", angular.bind(null, uploadProgress, i), false);    

最后,您还可以使用普通的 closure (这是更多的代码,但有一个好处,允许您指定任意参数顺序):

function uploadProgress(evt, i) {
    ...

var j = i;   // because `i` might have changed by the time 
             // our callback is called, we need the current value
xhr.upload.addEventListener("progress", function (evt) {
    uploadProgress(evt, j);
}, false);