how to redirect to error component when service give error?

Question

Could you please tell me how to redirect to component when service give error ?In my app I am requesting a service , I want if I got any error some service it will show error component

Here is my code

https://stackblitz.com/edit/angular-ctwnid?file=src%2Fapp%2Ftest.service.ts

In my current example I am using resolver to get data.

const routes: Routes = [
  {
    path: 'home', 
    component: HelloComponent,
    resolve: { data: TestResolver }

  },
  {
    path: 'error',
    component: ErrorComponent
  },
  {
    path: '', 
    redirectTo: '/home', 
    pathMatch: 'full'
  }
];

I changed requested url so that I will get an error

correct url :https://jsonplaceholder.typicode.com/todos/1 wrong url :https://jsonplaceholder.typicode.com/todoss/1

I want that if I get an error it redirects to Errorcomponent.

@Injectable()
export class TestResolver implements Resolve<Observable<string>> {
  constructor(private testService: TestService) {}

  resolve(): Observable<any> {
    return this.testService.getConfiguration();
  }
}

any update ?

I'm not really sure if you're using it the right way. I saw the StackBlitz, There are some conflicts in the way you've implemented it as opposed to the way it is implemented in the article. — SiddAjmera, Aug 27 '18 at 07:11

score 0 · Answer 1 · answered Aug 27 '18 at 05:50

You have a couple of options. You could use a Guard to handle this, but because it's based on resolved data, it would probably be a good idea to make it an interceptor. Here's a post that should point you in the right direction re: interceptors Using Router in services in Angular 4

score 0 · Answer 2 · answered Aug 27 '18 at 17:11

0

You can handle this in your component.ts

Whenever the API call fails just use

this._service.function().subscribe(success => {
.....
},
error => {
this.router.navigate['error'];
});

where you call your service.

answered Aug 27 '18 at 17:11

Ranjith Eswaran

333
2
12

how to redirect to error component when service give error?

2 Answers2