Displaying banks with Angular routing-part 45
Now I want to have a separate URL for each bank, like https://infovalutar.azurewebsites.net/bank/ECB
For this I read routing in Angular, https://angular.io/tutorial/toh-pt5 .
However , a small problem : when we change URL , from
https://infovalutar.azurewebsites.net/bank/ECB
to
https://infovalutar.azurewebsites.net/bank/BNR
we should re-load component – or the component be aware of changing.
Reading
https://kamranahmed.info/blog/2018/02/28/dealing-with-route-params-in-angular-5/
makes me change from
this.idBank = this.route.snapshot.paramMap.get(‘id’);
to
this.route.params.subscribe(rp=> {
this.idBank = rp.id;
}
);
Seems little to do, but I have had problems with changing the router-outlet – figuring where to put it. The creation of dashboard component and the routes
const routes: Routes = [
{ path: ”, redirectTo: ‘/dashboard’, pathMatch: ‘full’ },
{ path: ‘dashboard’, component: DashboardComponent },
{path:’bank/:id’,component:BankComponent}
]
were enough trouble.
Infovalutar
And one hour passes...(This is the result of 1 hour per day auto-challenge as a full cycle developer for an exchange rates application)
( You can see the sources at https://github.com/ignatandrei/InfoValutar/ )
Leave a Reply