在 Angular 5 个 http 请求中使用 observable 有什么好处？

Question

我对在 angular 中使用 httpclient 感到困惑 5.I 是 angular 的新手，只是关注官方 angular tutorial.I 对 observables 了解不多,promise,pipe 等..目前我有一个服务来处理我正在使用的所有 http methods.For post 请求 pipe.Below 是方法。

create(model: any,URI) :Observable<Object>{
    return this.http.post(API_URL+URI, model)
    .pipe(
        catchError(this.handleError('create', model))
    );
}



private handleError<T> (operation = 'operation', result?: T) {
        return (error: any): Observable<T> => {

        console.error("default"+error); // log to console instead
        var errors=error["error"];

        var type=errors.errors;

        this.log(`${operation} failed: ${JSON.stringify(errors.errors)}`);

        return of(result as T);
        };
    }

      private log(message: string) {
        this.messageService.add('DataService: ' + message);
      }

在组件内部我这样调用创建方法..

onSubmit() { 
        this.loading = true;
        this._dataService.create(this.model,companytype_url).subscribe(data => {
            console.log("inside component data type-company"+JSON.stringify(data));
        },
        error=>{
            var error_data=JSON.stringify(error);
            console.log("inside component error type-company ->" + error_data)
        }
        );
        this.submitted = true;
        this.loading = false;
        this.companytypeForm.reset();
    }

我应该在组件中使用订阅吗？我需要一个通用的 http class 来处理所有 api requests.It 是一个很大的应用程序并且有很多 components.Since 我是 Angular 我的新手对调用 http 方法的不同方式感到困惑。

Answer 1

Should I use subscribe in component?

是的。如果您不订阅，则不会向服务器发送任何内容

I need a general http class to handle the all the api requests

这就是 HttpClient。如果您的服务是完全通用的，它不会向 HttpClient 已经提供的内容添加任何内容。使用专用服务，它实际上提供了更高级别的抽象：具有类型化参数、转换必要的输入、使用适当的 URL、return 类型化对象、知道如何转换响应等

Since I am new to Angular I am confused about the different ways of calling http methods.

这就是 Angular 提供...文档的原因。比如这个HttpClient guide, and this RxJS guide。阅读它们。

在 Angular 5 个 http 请求中使用 observable 有什么好处？

What is the benefit of using observable in Angular 5 http requests?

rxjs

rxjs5

angular

angular5