Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 9f03fca

Browse files
docs(cookbook): text following a node requires a dot
1 parent 63e0e6e commit 9f03fca

File tree

1 file changed

+22
-22
lines changed

1 file changed

+22
-22
lines changed

public/docs/ts/latest/cookbook/set-document-title.jade

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,21 @@ a(id='top')
99
.l-sub-section
1010
img(src='/resources/images/devguide/plunker-separate-window-button.png' alt="pop out the window" align="right" style="margin-right:-20px")
1111
:marked
12-
To see the browser Title bar changes,
12+
To see the browser Title bar changes,
1313
pop out the preview window by clicking the blue 'X' button in the upper right corner.
1414
:marked
1515
## The problem with *<title>*
16-
16+
1717
The obvious approach is to bind a property of the component to the HTML `<title>` like this:
18-
code-example(format='')
18+
code-example(format='').
1919
&lt;title&gt;{{This_Does_Not_Work}}&lt;/title&gt;
2020
:marked
21-
Sorry but that won't work.
21+
Sorry but that won't work.
2222
The root component of our application is an element contained within the `<body>` tag.
2323
The HTML `<title>` is in the document `<head>`, outside the body, making it inaccessible to Angular data binding.
2424

25-
We could grab the browser `document` object and set the title manually.
26-
That's dirty and undermines our chances of running the app outside of a browser someday.
25+
We could grab the browser `document` object and set the title manually.
26+
That's dirty and undermines our chances of running the app outside of a browser someday.
2727
.l-sub-section
2828
:marked
2929
Running your app outside a browser means that you can take advantage of server-side
@@ -40,16 +40,16 @@ code-example(format='')
4040
* `getTitle() : string` &mdash; Gets the title of the current HTML document.
4141
* `setTitle( newTitle : string )` &mdash; Sets the title of the current HTML document.
4242

43-
While this class is part of the Browser platform package, it is *not part of the default Browser
44-
platform providers* that Angular loads automatically.
43+
While this class is part of the Browser platform package, it is *not part of the default Browser
44+
platform providers* that Angular loads automatically.
4545
This means as we bootstrap our application using the Browser platform `boostrap()`
4646
function, we'll also have to include `Title` service explicitly as one of the bootstrap providers:
4747

4848
+makeExample( "cb-set-document-title/ts/app/main.ts", "bootstrap-title", "app/main.ts (provide Title service)" )(format='.')
4949
:marked
5050
Once we've explicitly provided the `Title` service we can then inject the `Title` service into any of our
51-
custom application components and services.
52-
51+
custom application components and services.
52+
5353
Let's inject the `Title` service into the root `AppComponent` and expose a bindable `setTitle` method that calls it:
5454

5555
+makeExample( "cb-set-document-title/ts/app/app.component.ts", "class", "app/app.component.ts (class)" )(format='.')
@@ -61,31 +61,31 @@ figure.image-display
6161
:marked
6262
Here's the complete solution
6363

64-
+makeTabs(
64+
+makeTabs(
6565
`cb-set-document-title/ts/app/main.ts,
66-
cb-set-document-title/ts/app/app.component.ts`,
67-
'',
66+
cb-set-document-title/ts/app/app.component.ts`,
67+
'',
6868
'app/main.ts, app/app.component.ts' )
6969

7070
//
71-
Todo: tie this back to the router so we can see how to use this Title service to (re)set the title
71+
Todo: tie this back to the router so we can see how to use this Title service to (re)set the title
7272
that appears in the window navigation history and shows up in the back/forward buttons
7373
during routing.
74-
74+
7575
See https://github.com/angular/angular/issues/7630#issuecomment-198328802
76-
76+
7777
.l-main-section
7878
:marked
7979
## Why we provide the *Title* service in *bootstrap*
80-
80+
8181
We generally recommended providing application-wide services in the root application component, `AppComponent`.
82-
83-
Here we recommend registering the title service during bootstrapping,
82+
83+
Here we recommend registering the title service during bootstrapping,
8484
a location we reserve for configuring the runtime Angular environment.
85-
85+
8686
That's exactly what we're doing.
87-
The `Title` service is part of the Angular *browser platform*.
88-
If we bootstrap our application into a different platform,
87+
The `Title` service is part of the Angular *browser platform*.
88+
If we bootstrap our application into a different platform,
8989
we'll have to provide a different `Title` service that understands the concept of a "document title" for that specific platform.
9090
Ideally the application itself neither knows nor cares about the runtime environment.
9191
:marked

0 commit comments

Comments
 (0)