Consider the below dynamic route:
export const routes: Routes = [
{
path: 'template/:templateId',
component: TemplateComponent,
data: { pageTitle: 'TEMPLATES'}
}]
Is it possible to have dynamic pageTitle for same route and same component ?
In this scenario the path remains the same 'template/:templateId' component also remains same 'TemplateComponent' but the URL changes to 'template/01' and 'template/02'.
You can do that (as R. Richards indirectly pointed out) using the Title in @angular/platform-browser
You could do the change locally (in each component on initialization - ngOnInit, but that would be repetitive and changing every title - if needed, would become a time consuming job) or you could make a service in which you change the title of the page based on the ActiveRoute
I'd say a Resolver could be a reasonable solution. It could take the param of the ActivatedRouteSnapshot, and return a title that matches the route from its resolve-function.
Usage for the route would be something like this:
export const routes: Routes = [
{
path: 'template/:templateId',
component: TemplateComponent,
resolve: { pageTitle: TemplateResolveService },
}]