Merge pull request #10815 from abpframework/auto-merge/rel-5-0/672

Merge branch dev with rel-5.0

docs/en/UI/Angular/HTTP-Error-Reporter-Service.md

@@ -0,0 +1,71 @@
+# HTTP Error Reporter Service
+
+`HttpErrorReporterService` is a service which is exposed by `@abp/ng.core` package. HTTP errors can be reported by using this service. The service emits an event when an error is reported and keeps the errors as an array. The [`RestService`](./HTTP-Requests#restservice) uses the `HttpErrorReporterService` for reporting errors.
+
+See the example below to learn how to report an error:
+
+```ts
+import { HttpErrorReporterService } from '@abp/ng.core';
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { of } from 'rxjs';
+import { catchError } from 'rxjs/operators';
+
+@Injectable()
+export class SomeService {
+  constructor(private http: HttpClient, private httpErrorReporter: HttpErrorReporterService) {}
+
+  getData() {
+    return this.http.get('http://example.com/get-data').pipe(
+      catchError(err => {
+        this.httpErrorReporter.reportError(err);
+        return of(null);
+      }),
+    );
+  }
+}
+```
+
+See the following example to learn listening the reported errors:
+
+```ts
+import { HttpErrorReporterService } from '@abp/ng.core';
+import { HttpErrorResponse } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+
+@Injectable()
+export class MyErrorHandler {
+  constructor(private httpErrorReporter: HttpErrorReporterService) {
+    this.handleErrors();
+  }
+
+  handleErrors() {
+    this.httpErrorReporter.reporter$.subscribe((err: HttpErrorResponse) => {
+        // handle the errors here
+    });
+  }
+}
+```
+
+
+## API
+
+
+### `reporter$: Observable<HttpErrorResponse>`
+
+`reporter$` is a getter, returns an observable. It emits an event when a new error is reported. The event value type is `HttpErrorResponse`.
+
+
+### `errors$: Observable<HttpErrorResponse[]>`
+
+`errors$` is a getter, returns an observable. It emits an event when a new error is reported. The event value is all errors reported at runtime.
+
+### `errors: HttpErrorResponse`
+
+`errors` is a getter that returns all errors reported.
+
+
+### `reportError(error: HttpErrorResponse): void`
+
+`reportError` is a method. The errors can be reported via this. 
+When an error is reported, the method triggers the `reports$` and `errors$` observables to emit an event.

docs/en/UI/Angular/HTTP-Requests.md

@@ -21,13 +21,13 @@ getConfig() {
 
 Although clear and flexible, handling errors this way is repetitive work, even when error processing is delegated to the store or any other injectable.
 
-An `HttpInterceptor` is able to catch `HttpErrorResponse`  and can be used for a centralized error handling. Nevertheless, cases where default error handler, therefore the interceptor, must be disabled require additional work and comprehension of Angular internals. Check [this issue](https://github.com/angular/angular/issues/20203) for details.
+An `HttpInterceptor` is able to catch `HttpErrorResponse` and can be used for a centralized error handling. Nevertheless, cases where default error handler, therefore the interceptor, must be disabled require additional work and comprehension of Angular internals. Check [this issue](https://github.com/angular/angular/issues/20203) for details.
 
 
 
 ## RestService
 
-ABP core module has a utility service for HTTP requests: `RestService`. Unless explicitly configured otherwise, it catches HTTP errors and dispatches a `RestOccurError` action. This action is then captured by the `ErrorHandler` introduced by the `ThemeSharedModule`. Since you should already import this module in your app, when the `RestService` is used, all HTTP errors get automatically handled by default.
+ABP core module has a utility service for HTTP requests: `RestService`. Unless explicitly configured otherwise, it catches HTTP errors and dispatches a `RestOccurError` action. This action is then captured by the `ErrorHandler` introduced by the `ThemeSharedModule`. Since you should already import this module in your app, when the `RestService` is used, all HTTP errors get automatically handled by default.
 
 
 
@@ -67,7 +67,7 @@ getFoo(id: number) {
 
 
 
-The `request` method always returns an `Observable<T>`. Therefore you can do the following wherever you use `getFoo` method:
+The `request` method always returns an `Observable<T>`. Therefore you can do the following wherever you use `getFoo` method:
 
 ```js
 doSomethingWithFoo(id: number) {
@@ -205,7 +205,7 @@ You may find `Rest.Observe` enum [here](https://github.com/abpframework/abp/blob
 
 ## HTTP Error Handling
 
-When the `RestService` is used, all HTTP errors are automatically handled by `ErrorHandler` which is a service that exposed by the `@abp/ng.theme.shared` package.
+When the `RestService` is used, all HTTP errors are reported to the [`HttpErrorReporterService`](./HTTP-Error-Reporter-Service), and then `ErrorHandler`, a service exposed by the `@abp/ng.theme.shared` package automatically handles the errors.
 
 ### Custom HTTP Error Handler