Bài đăng

Hiển thị các bài đăng có nhãn angular

Dynamic title trong Angular

Dynamic title trong Angular Trong nhiều huống ta cần thay dổi nội dung title của trang web cho phù hợp với nội dung của trang web và Angular 2 đã hỗ sợ sẵn một service cho phép thay đổi title của trang. Để set title thì ta sẽ sử dụng Title service trong @angular/platform-browser bằng cách Inject vào AppComponent thông qua constructor import { Title } from '@angular/platform-browser'; export class AppComponent { // code... constructor(private title: Title){} // code... } Trong AppComponent ta lắng nghe sự kiện thay đổi URL khi điều hướng. routeLinkChange(){ this.router.events.filter((event) => event instanceof NavigationEnd) .subscribe((evt: NavigationEnd) => { const title = this.getDeepestRoutingData(this.route.snapshot).title; this.title.setTitle(title ? title : 'Default title'); } ); } Trong đó hàm getDeepestRoutingData() sẽ lấy data được đặt trong một routing nào đó như app-routing.module