Skip to content

Commit 0a1891b

Browse files
committed
Update page title on routes
1 parent 5d6175f commit 0a1891b

File tree

3 files changed

+43
-4
lines changed

3 files changed

+43
-4
lines changed

angular.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
{
22
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"cli": {
4+
"analytics": false
5+
},
36
"version": 1,
47
"newProjectRoot": "projects",
58
"projects": {

projects/train-platform/src/app/app-routing.module.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { NgModule } from '@angular/core';
2-
import { Routes, RouterModule } from '@angular/router';
2+
import { RouterModule, Routes } from '@angular/router';
33
import { BookingModule } from '../booking/booking.module';
44
import { BookingComponent } from '../booking/booking/booking.component';
55
import { JourneySelectionComponent } from '../journey/journey-selection/journey-selection.component';
@@ -10,10 +10,12 @@ const routes: Routes = [
1010
path: '',
1111
pathMatch: 'full',
1212
component: JourneySelectionComponent,
13+
data: { title: 'Journeys' },
1314
},
1415
{
1516
path: 'bookings/journey/:journeyId',
1617
component: BookingComponent,
18+
data: { title: 'Book journey' },
1719
},
1820
];
1921

projects/train-platform/src/app/app.component.ts

Lines changed: 37 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
1-
import { Component, HostBinding, OnDestroy } from '@angular/core';
1+
import { Component, HostBinding, OnDestroy, OnInit } from '@angular/core';
2+
import { Title } from '@angular/platform-browser';
3+
import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
24
import { Subscription } from 'rxjs';
5+
import { filter, map } from 'rxjs/operators';
36
import { ThemeService } from './theme.service';
47

58
@Component({
@@ -12,18 +15,49 @@ import { ThemeService } from './theme.service';
1215
`,
1316
styleUrls: ['./app.component.css'],
1417
})
15-
export class AppComponent implements OnDestroy {
18+
export class AppComponent implements OnInit, OnDestroy {
1619
subscription: Subscription;
1720

1821
@HostBinding('class') classes = 'dark';
1922

20-
constructor(private themeService: ThemeService) {
23+
constructor(
24+
private router: Router,
25+
private titleService: Title,
26+
private themeService: ThemeService
27+
) {
2128
this.subscription = this.themeService.theme$.subscribe((theme) => {
2229
this.classes = theme;
2330
});
2431
}
2532

33+
ngOnInit() {
34+
this.updatePageTitleOnRouteChange();
35+
}
36+
2637
ngOnDestroy(): void {
2738
this.subscription.unsubscribe();
2839
}
40+
41+
private updatePageTitleOnRouteChange() {
42+
this.router.events
43+
.pipe(
44+
filter((event) => event instanceof NavigationEnd),
45+
map(() => {
46+
let route: ActivatedRoute = this.router.routerState.root;
47+
let routeTitle = '';
48+
while (route!.firstChild) {
49+
route = route.firstChild;
50+
}
51+
if (route.snapshot.data['title']) {
52+
routeTitle = route!.snapshot.data['title'];
53+
}
54+
return routeTitle;
55+
})
56+
)
57+
.subscribe((title) => {
58+
if (title) {
59+
this.titleService.setTitle(`${title} - Microtrains`);
60+
}
61+
});
62+
}
2963
}

0 commit comments

Comments
 (0)