angular2可观察链接与多个帖子请求

时间:2017-02-07 12:51:32

标签: angular http-post observable chaining

我需要帮助,因为我试图在angular2中链接3个单独的帖子请求。 第一次调用后:CreatePath(),我正在为一些要上传的文件创建特定路径。

第二个帖子:uploadFiles(文件),它将文件上传到我们从第一次通话中收到的特定路径。

第三次调用:updateBackend(sentdata,projId,pinId),它使用从“第二次调用后”收到的数据更新后端。然而,第二次呼叫不仅仅是一个单一的呼叫。事实上,它在循环中包含多个文件上传,我必须等待所有文件完成上传,然后调用第三次调用以更新后端。下面我粘贴了所有三个功能,这些功能完全可以单独工作,但不知道如何用可观察的方式正确链接它们。请帮忙:

// *********** ****************

createPath(){

  var data = {};
  var URL = 'https://api.dropboxapi.com/2/files/create_folder';
  var path = '/Apps/pinwalk/asadtemp';
  var token = 'XYZ';


  let headers = new Headers();
  headers.append('Content-Type', 'application/json');
  headers.append('Authorization', 'Bearer ' + token);
  data = JSON.stringify({
    path: path,
    autorename: true,
  });
  let options = new RequestOptions({ headers: headers });
  this.http.post(URL, data, options)
      .map((res: Response) => { this.pathReturned = res.json(); return this.pathReturned.path_display; })
      .catch(error => Observable.throw(error))
      .subscribe(
          data => console.log('path created : success' + JSON.stringify(this.pathReturned)),
          error => console.log(error)
      )


}//create path

// *********** ****************

uploadFiles(files) {

    var dataArray = [];
    var data;
    var URL = 'https://content.dropboxapi.com/2/files/upload';
    var token = 'XYZ';//its the token

    var fls = files.files;
    var len = fls.length;
    var chk = 0;

    var i = 0;
    for ( i=0; i < len; i++) {

      var file = fls[i];
      // var file = files.files[0];
      let headers = new Headers();
      headers.append('Content-Type', 'application/octet-stream');
      headers.append('Authorization', 'Bearer ' + token);
      headers.append('Dropbox-API-Arg', JSON.stringify({
        path:'/Apps/pinwalk/asadtemp' +"/"+  file.name,
        mode: 'add',
        autorename: true,
        mute: false
      }));
      let options = new RequestOptions({ headers: headers });
      this.http.post(URL, file, options)
          // .map(res => console.log(res.json()))
          .map((res: Response) => { data = res.json();
                                    var filedata = {storageId: data.id,
                                                    originalName: data.name,
                                                    storageSize: data.size,
                                                    description: "desc",
                                                    tempFilePath: data.path_display,
                                                    type: 'images' };
                                    console.log(filedata);
                                    dataArray.push(filedata); //pushing data into the array
                                    chk++;
                                    if(chk == len){
                                      var newdata = {data:dataArray};
                                      var sentdata = JSON.stringify(newdata);
                                      console.log(sentdata);
                                      // return sentdata;
                                      // this.createPath();
                                    }//if
          })
          .catch(error => Observable.throw(error))
          .subscribe(
              data => console.log('file uploaded : success'),
              error =>{ console.log(error); console.log("file(s) cannot be uploaded this time."); return 0;}
          )
    }//for
}//end uploadFiles

// *********** ****************

  updateBackend(sentdata, projId,pinId){

    var dataReturned;

    var URL = 'http://192.241.234.109/v1/project/'+projId+'/pin/'+pinId+'/mediafile';
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    let options = new RequestOptions({ headers: headers });
    this.http.post(URL, sentdata, options)
        .map((res: Response) => { dataReturned = res.json(); })
        .catch(error => Observable.throw(error))
        .subscribe(
            data => console.log('Backend Updated : success' + JSON.stringify(dataReturned)),
            error => console.log(error)
        )



}//updateBackend

0 个答案:

没有答案