使用一个函数调用可观察值，将3个不同的可观察值与开关图绑定在一起导致错误

问题描述

我有一个将文件上传到html表单时运行的功能。

uploadidnexttofacepicture(event){
    let subscription = this.s3service.publicresourceuploadtos3(event)
      .subscribe((req: any)=>{
        console.log(req);
      });
    
  }

此函数从注入的服务中调用函数publicresourceuploadtos3。此功能如下所示：

publicresourceuploadtos3(event): Observable<any>{
    console.log('the service at least ran');

    const mediatobeuploaded = event.target.files[0];
    this.http.get(environment.public_generate_presigned_url_resource).pipe(
      switchMap((req : any)=>{
        console.log('did the call to the server');

        const resourceurl = req.uriroot + req.fields.key;

        let fd = new FormData();
        fd.append('acl',req.fields.acl);
        fd.append('key',req.fields.key);
        fd.append('content-type',req.fields['content-type']);
        fd.append('policy',req.fields.policy);
        fd.append('x-amz-algorithm',req.fields['x-amz-algorithm']);
        fd.append('x-amz-credential',req.fields['x-amz-credential']);
        fd.append('x-amz-date',req.fields['x-amz-date']);
        fd.append('x-amz-signature',req.fields['x-amz-signature']);
        fd.append('file',mediatobeuploaded);
        this.http.post(req.url,fd).pipe(
          switchMap((req2: any)=>{
            const result = {
              resourceurl : resourceurl,resourcekey: req.fields.key
            };
            return of(result);


        }));


      }));


  }

控制台日志console.log('the service at least ran');确实在控制台中触发，但是服务器调用了一个：console.log('did the call to the server'); 没有。

但这会导致错误：

ERROR TypeError: Cannot read property 'subscribe' of undefined
    at ContentcreatorverificationComponent.uploadidnexttofacepicture

我担心这是一个语法问题，如果你们中的任何一个知道发生了什么事情，都会有所帮助。

解决方法

尝试在return之前添加this.http.get(environment.public_generate_presigned_url_resource)

应该是这样

 publicresourceuploadtos3(event): Observable<any>{
    console.log('the service at least ran');

    const mediatobeuploaded = event.target.files[0];
   return this.http.get(environment.public_generate_presigned_url_resource).pipe(
      switchMap((req : any)=>{
        console.log('did the call to the server');

        const resourceurl = req.uriroot + req.fields.key;

        let fd = new FormData();
        fd.append('acl',req.fields.acl);
        fd.append('key',req.fields.key);
        fd.append('content-type',req.fields['content-type']);
        fd.append('policy',req.fields.policy);
        fd.append('x-amz-algorithm',req.fields['x-amz-algorithm']);
        fd.append('x-amz-credential',req.fields['x-amz-credential']);
        fd.append('x-amz-date',req.fields['x-amz-date']);
        fd.append('x-amz-signature',req.fields['x-amz-signature']);
        fd.append('file',mediatobeuploaded);
        this.http.post(req.url,fd).pipe(
          switchMap((req2: any)=>{
            const result = {
              resourceurl : resourceurl,resourcekey: req.fields.key
            };
            return of(result);


        }));


      }));


  }