document.title for Ember

This addon provides a component for changing the title of the page you're on.

Installing via ember-cli

If inside an ember-cli project, you can install the component as an addon:

ember install:addon ember-document-title

Usage

To start, let's add a root title for your application. This goes in application.hbs.

{{#document-title}}My App{{/document-title}}

This sets the title for your application. When your application loads, you should see the title My App appear. If you would like a block-less version of this component, it's available by setting the title property:

{{document-title title="My App"}}

By default, using the component will allow an interaction where additional titles are appended to the root:

You can change the separator by specifying the separator attribute.

Separators can be changed at arbitrary levels:

Titles can be prepended to the parent, by setting the prepend attribute to true.

This allows one to swap the order at arbitrary levels:

And for special templates that need to complete control over the title, set the replace attribute to true. This will only apply for that level.

In addition, there's no limit to the amount of titles you can put in a route:

API

attribute	type	default
separator	string	`"
prepend	boolean	false
replace	boolean	false