Angular

Question

我实现了一个 return 是 Observable 的方法。在此方法中，我使用 http.post 向后端发送请求。收到响应后，这是一个 JSON 对象，我想将其存储在一个 Observable 变量和 return 该变量中。但不知何故，我没能解决这个问题。在 .subscribe 中，res 变量未存储在 postResponse 变量中，但我可以在 "local" console.log 中看到 res 变量具有正确的值。全局 console.log 是空的。此外我得到错误：

"TS2322: Type 'ArqResponse' is not assignable to type 'Observable'" error for the return.

我的代码如下所示：

postARQRequest(request): Observable<ArqResponse>{
    let postResponse = new ArqResponse;
    const result = this.http.post<ArqResponse>(this.arqUrl, request)
                       .subscribe((res: ArqResponse) => { postResponse = res; console.log('shadow: ' + res)});
    console.log('global: ' + JSON.stringify(postResponse));
    return postResponse;
}

我的问题是：

如何将响应主体存储在变量中，然后可以被 return 教育？
我怎样才能 "cast" 一个 ArqResponse 变量到一个可观察变量？
.subscribe 似乎是错误的，因为我得到：

this.arqService.postARQRequest(...).subscribe is not a function error

Answer 1

Y方法http.post已经return一个Observable，所以你可以直接这样做：

postARQRequest(request): Observable<ArqResponse>{
    return this.http.post<ArqResponse>(this.arqUrl, request);
}

然后订阅它：this.arqService.postARQRequest(...).subscribe()

如果你想将对象转换为 Observable，你可以使用 Rxjs6:

中的 of

import { of } from 'rxjs';

// ...

// create an Observable from a value:
of(someObject);

Answer 2

我猜这就是你想要的：

postARQRequest(request): Observable<ArqResponse>{
    return this.http.post<ArqResponse>(this.arqUrl, request);
}

这里无需订阅任何内容。鉴于 this.http.post return 是您想要的类型，只需 return 即可。

如果您真的想将响应存储在局部变量中，有一些方法可以做到：

使用承诺来获取结果。稍后使用 of 使其可观察：

async postARQRequest(request): Observable<ArqResponse>{
    let postResponse = new ArqResponse;
    postResponse = await this.http.post<ArqResponse>(this.arqUrl, request).toPromise();

    return of(postResponse);
}

使用 tap 运算符对响应做出反应，但不改变它

postARQRequest(request): Observable<ArqResponse>{
    return this.http.post<ArqResponse>(this.arqUrl, request).pipe(
        tap((res) => ...) // do stuff with res here, but it won't be mutated
    );
}

使用 map 运算符将响应映射到其他内容

postARQRequest(request): Observable<ArqResponse>{
    return this.http.post<ArqResponse>(this.arqUrl, request).pipe(
        map((res) => ...) // do stuff with res here, but it *will map to whatever you return from this handler*
   );
}

Answer 3

我想这可能对你有帮助

postARQRequest(): Observable<ArqResponse[]> {
 return this.http.post(this.arqUrl, request)
 .map(this.extractData()) <== passing result of function
 .catch(this.handleError()); <== passing result of function
}

在此处处理响应和错误

private extractData(res: Response) {
   let body = res.json(); 
   return body.data || { }; 
}

private handleError (error: any) {
    let errMsg = error.message || 'Server error';
    console.error(errMsg); 
    return Observable.throw(errMsg);
}

Angular - 在 Http.post 中接收和 return Observable<T> 响应

Angular - receive and return Observable<T> response in Http.post

observable

rxjs

typescript

rxjs6