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?
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?
Share Improve this question edited Apr 21, 2017 at 13:55 user663031 asked Dec 22, 2015 at 19:09 Arūnas SmaliukasArūnas Smaliukas 3,3216 gold badges30 silver badges48 bronze badges 01 Answer
Reset to default 9Angular2 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.
EDIT:
As of the release (2.0.0), this is how you can do it:
import { Title } from '@angular/platform-browser';
export class SomeComponent {
constructor(title: Title) {
// title.getTitle();
// title.setTitle('new title');
}
}
And the docs for the Title service are now here: https://angular.io/docs/ts/latest/api/platform-browser/index/Title-class.html