Arūnas Smaliukas Arūnas Smaliukas - 4 months ago 23
Javascript Question

Angular 2.x change <title> in head (outside my app)

I think it should be easy but I cannot find how.

I have something like

<html>
<head>
<title>{{'a' + 'b'}}</title>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>


It seems like I cannot access anything outside
my-app
.

In angular 1.x it was easy, I was able to add
ng-app
on any element (
<html ng-app="myApp">
).

Now I think I'm able only bootstrap in body.

I know I can manually bootstrap somehow (didn't try yet), but dynamically change title in single page applications should be super-easy, shouldn't it?

Answer

Angular2 can't be bootstrapped to entire html. But you can use Title Service.

A service that can be used to get and set the title of a current HTML document.

It has 2 methods:

getTitle()

setTitle()

Don't forget to check the dependency injection section out to see how you can use the services.