Question

我的目的是在Angular中使用REST Web服务，我现在正在做一些试验。下面的代码不起作用，并进入错误块。您能帮我找出问题吗？谢谢。

 interface UserResponse {
     login: string;
     bio: string;
     company: string;
   }

    constructor(public http: HttpClient) {
        this.http.get<UserResponse>('https://api.github.com/users/seeschweiler')
        .pipe( tap(heroes =>{
             alert()
             }),
          catchError(this.handleError('getHeroes', []))
        );
      }

      private handleError<T> (operation = 'operation', result?: T) {
           alert()
      return (error: any): Observable<T> => {
        // TODO: send the error to remote logging infrastructure
        console.error(error); // log to console instead

        // TODO: better job of transforming error for user consumption
        console.log(`${operation} failed: ${error.message}`);

        // Let the app keep running by returning an empty result.
        return of(result as T);
      };
    }

Answer 1

您需要订阅Observable才能启动它：

....
constructor(public http: HttpClient) {
    this.http.get<UserResponse>('https://api.github.com/users/seeschweiler')
    .catch(this.handleError('getHeroes', [])))
    .subscribe(response => console.log(response));
  }
  ....

或者，您仍然可以使用管道，但仍然需要订阅

    constructor(public http: HttpClient) {
    this.http.get<UserResponse>('https://api.github.com/users/seeschweiler')
    .pipe(
        tap(response => { 
            console.log(response); 
            /* process your data */ 
            return response;}),
        catchError(this.handleError('getHeroes', [])),
        )
    .subscribe(processingResult => /* handle processed response */);
  }

Answer 2

HttpClient#get()提供了所谓的“冷可观察”。这意味着，它将不会执行任何幕后工作，直到有一个可观察者。而且，多个订阅（默认情况下）将导致发出多次请求通知（除非您以特定的“共享”方式传送）

所以：

    this.http.get<UserResponse>('https://api.github.com/users/seeschweiler')
    .pipe( tap(heroes =>{
         alert()
         }),
      catchError(this.handleError('getHeroes', []))
    ).subscribe(result=>console.log(result));

将提出您的请求。

请仔细阅读以了解要走的教程（《英雄之旅》），因为其中有合理详细的解释。

Answer 3

由于它返回可观察值，因此您需要订阅该值。这是解决方案和结果。

this.http.get<any>('https://api.github.com/users/seeschweiler').subscribe( x => console.log(x));

控制台Result中的结果：

http.get（）方法在Angular中不起作用

3 个答案: