Angular2 Router and Multiple Resolves in one route

by

Alright, I hope I haven’t misunderstood the question.

Angular’s router supports as many resolvers per route as you want.

In the route declaration, the resolve property is an object and it can have as many keys as you’d like:

{
  path: '', 
  component: DashboardComponent,
  resolve: {
    foo: Resolver1
    bar: Resolver2,
    // more resolves here...
  }
}

Then retrieve the resolved data from your component:

@Component({ ... })
export class MyComponent {

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    const foo = this.route.snapshot.data['foo'];
    const bar = this.route.snapshot.data['bar'];
  }

}

The route won’t be activated until ALL resolves are complete/fulfilled.

Leave a Comment