1. 在AppComponent中定义一个属性来存储页面标题，例如可以定义为title: string。
2. 在AppComponent中使用Title服务来设置页面标题。在构造函数中注入Title服务，然后在ngOnInit中调用setTitle方法设置页面标题。 示例代码如下：

import { Component, OnInit } from '@angular/core'; import { Title } from '@angular/platform-browser';

@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent implements OnInit {

title: string = 'My App';

constructor(private titleService: Title) {}

ngOnInit() { this.titleService.setTitle(this.title); } }

3. 在需要动态修改页面标题的组件中，修改title属性的值即可。 示例代码如下：

import { Component, OnInit } from '@angular/core'; import { Title } from '@angular/platform-browser';

@Component({ selector: 'app-home', templateUrl: './home.component.html', styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit {

constructor(private titleService: Title) { }

ngOnInit() { this.titleService.setTitle('Home | My App'); }

}

注意：页面标题的设置需要在Angular的Zone之外执行。相应地，Title服务会自动执行NgZone.run()。因此，可以在页面标题的设置中不需要再手动调用NgZone。