Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 2 : How to get params on resolve

Routs Strategy:

export const routes = [
{
    path       : 'rto-activation/:id',
    component  : RtoActivationComponent,
    resolve  : {
        'singleRto': SingleRtoResolve
    },
    children   : [
        {path: 'start', component: ActivationStartComponent},
        {path: 'warning', component: WarningComponent},
        {path: 'confirm', component: ConfirmRtoDetailsComponent},
        {path: 'ldWaiver', component: LDWaiverComponent},
        {path: 'payment-schedule', component: PaymentScheduleComponent},
        {path: 'user-reference', component: ReferenceComponent}

    ]
}

SingleRtoResolve:

constructor(private router: Router,
            private route: ActivatedRoute) {
}

resolve() {
    var self = this;
    return new Promise((resolve, reject) => {
        self.subscription = self.route.params.subscribe(
            (param: any) => {
                let id = param[ 'id' ];
               self.rtoService.getRto(null, +id)
                .then((res: any) => {
                    resolve(res)
                })

            });
    });
    }

I Know: We usually get params from ActivatedRoute service.

Question: Can i get params from Router service.

Brief: Trying to get route params on Resolve Injectable because on that stage route is not actived and i am unable to get params.

Usecase: When a user opens any child routes(implicity and explicitly)with some (:id) so data should be resolved in parent routes.

Get Params successfully when route is actived in any child component:

ngOnInit() {
let self          = this;
this.subscription = this.route.params.subscribe(
    (param: any) => {
        let id = param[ 'id' ];
        self.rtoService.getRto(null, +id)
            .then((res: any) => {

            })

    });
}
like image 666
Faris Avatar asked Jan 04 '17 05:01

Faris


People also ask

How do you access the parameters passed to a route in Angular?

The first way is through the route snapshot. The route snapshot provides the initial value of the route parameter map (called the paramMap ). You can access the parameters directly without subscribing or adding observable operators. The paramMap provides methods to handle parameter access like get , getAll , and has .

How do you read route parameters?

Reading Route ParametersThe ProductDetails component must read the parameter, then load the product based on the ID given in the parameter. The ActivatedRoute service provides a params Observable which we can subscribe to to get the route parameters (see Observables).


1 Answers

Your SingleRtoResolve should implements Resolve<T>. Then you'll just need your data service (RtoServicei guess) in your constructor() {}. No need for the Router or the ActivatedRoute here since your resolve() will get a ActivatedRouteSnapshot and a RouterStateSnapshot. So the resolve() will look smth like that:

  resolve(
    route: ActivatedRouteSnapshot, state: RouterStateSnapshot
  ): Promise<any> {
    return ...
  }

..and you can just use route.params['id']to get your id.


Edit: You can also check the docs for the Resolve

like image 97
benny_boe Avatar answered Oct 26 '22 18:10

benny_boe