diff --git a/aio/content/guide/animations.md b/aio/content/guide/animations.md index 4eff1dc4829..4f48dae2cef 100644 --- a/aio/content/guide/animations.md +++ b/aio/content/guide/animations.md @@ -66,7 +66,7 @@ The examples in this page are available as a . ## Quickstart example: Transitioning between two states
- A simple transition animation + A simple transition animation
@@ -172,7 +172,7 @@ controls the timing of switching between one set of styles and the next:
- In Angular animations you define states and transitions between states + In Angular animations you define states and transitions between states
@@ -220,7 +220,7 @@ transitions that apply regardless of which state the animation is in. For exampl
- The wildcard state can be used to match many different transitions at once + The wildcard state can be used to match many different transitions at once
@@ -237,7 +237,7 @@ regardless of what state it was in before it left.
- The void state can be used for enter and leave transitions + The void state can be used for enter and leave transitions
@@ -247,7 +247,7 @@ The wildcard state `*` also matches `void`. ## Example: Entering and leaving
- Enter and leave animations + Enter and leave animations
@@ -294,7 +294,7 @@ These two common animations have their own aliases: ## Example: Entering and leaving from different states
- Enter and leave animations combined with state animations + Enter and leave animations combined with state animations
@@ -313,7 +313,7 @@ This gives you fine-grained control over each transition:
- This example transitions between active, inactive, and void states + This example transitions between active, inactive, and void states
@@ -346,7 +346,7 @@ If you don't provide a unit when specifying dimension, Angular assumes the defau ## Automatic property calculation
- Animation with automated height calculation + Animation with automated height calculation
@@ -405,7 +405,7 @@ and the delay (or as the *second* value when there is no delay):
- Animations with specific timings + Animations with specific timings
@@ -427,7 +427,7 @@ slight delay of 10 milliseconds as specified in `'0.2s 10 ease-out'`: ## Multi-step animations with keyframes
- Animations with some bounce implemented with keyframes + Animations with some bounce implemented with keyframes
@@ -461,7 +461,7 @@ offsets receive offsets `0`, `0.5`, and `1`. ## Parallel animation groups
- Parallel animations with different timings, implemented with groups + Parallel animations with different timings, implemented with groups
diff --git a/aio/content/guide/aot-compiler.md b/aio/content/guide/aot-compiler.md index e808b645b95..3299f207d31 100644 --- a/aio/content/guide/aot-compiler.md +++ b/aio/content/guide/aot-compiler.md @@ -601,8 +601,8 @@ The `source-map-explorer` analyzes the source map generated with the bundle and showing exactly which application and Angular modules and classes are included in the bundle. Here's the map for _Tour of Heroes_. - +
- toh-pt6-bundle + toh-pt6-bundle
diff --git a/aio/content/guide/architecture.md b/aio/content/guide/architecture.md index 3207c57a15a..d840bd34ce7 100644 --- a/aio/content/guide/architecture.md +++ b/aio/content/guide/architecture.md @@ -27,7 +27,7 @@ You'll learn the details in the pages that follow. For now, focus on the big pic
- overview + overview
@@ -64,7 +64,7 @@ Learn these building blocks, and you're on your way. ## Modules
- Component + Component
@@ -182,7 +182,7 @@ These are two different and _complementary_ module systems. Use them both to wri
- Component + Component
@@ -244,7 +244,7 @@ Learn more from the [Angular modules](guide/ngmodule) page.
- Component + Component
@@ -284,7 +284,7 @@ Your app can take action at each moment in this lifecycle through optional [life ## Templates
- Template + Template
@@ -314,7 +314,7 @@ The `HeroDetailComponent` is a **child** of the `HeroListComponent`.
- Metadata + Metadata
@@ -330,7 +330,7 @@ Notice how `` rests comfortably among native HTML elements. Custom ## Metadata
- Metadata + Metadata
@@ -379,7 +379,7 @@ so it can get the list of heroes to display.
- Metadata + Metadata
@@ -406,7 +406,7 @@ into actions and value updates. Writing such push/pull logic by hand is tedious, read as any experienced jQuery programmer can attest.
- Data Binding + Data Binding
@@ -454,7 +454,7 @@ from the root of the application component tree through all child components.
- Data Binding + Data Binding
@@ -463,7 +463,7 @@ Data binding plays an important role in communication between a template and its component.
- Parent/Child binding + Parent/Child binding
@@ -478,7 +478,7 @@ Data binding is also important for communication between parent and child compon ## Directives
- Parent child + Parent child
@@ -556,7 +556,7 @@ Of course, you can also write your own directives. Components such as ## Services
- Service + Service
@@ -624,7 +624,7 @@ application logic into services and make those services available to components ## Dependency injection
- Service + Service
@@ -656,7 +656,7 @@ This is *dependency injection*. The process of `HeroService` injection looks a bit like this:
- Service + Service
diff --git a/aio/content/guide/attribute-directives.md b/aio/content/guide/attribute-directives.md index d5a2c00bf69..57fc788f14d 100644 --- a/aio/content/guide/attribute-directives.md +++ b/aio/content/guide/attribute-directives.md @@ -168,7 +168,7 @@ Now when the app runs, the `myHighlight` directive highlights the paragraph text
- First Highlight + First Highlight
@@ -280,7 +280,7 @@ the mouse hovers over the `p` and disappears as it moves out.
- Second Highlight + Second Highlight
@@ -438,7 +438,7 @@ Here are the harness and directive in action.
- Highlight v.2 + Highlight v.2
@@ -491,7 +491,7 @@ Here's how the harness should work when you're done coding.
- Final Highlight + Final Highlight
diff --git a/aio/content/guide/cli-quickstart.md b/aio/content/guide/cli-quickstart.md index 0b26fac9e7d..f593e348928 100644 --- a/aio/content/guide/cli-quickstart.md +++ b/aio/content/guide/cli-quickstart.md @@ -123,7 +123,7 @@ Your app greets you with a message:
- The app works! + The app works!
@@ -161,7 +161,7 @@ Open `src/app/app.component.css` and give the component some style.
- Output of QuickStart app + Output of QuickStart app
diff --git a/aio/content/guide/component-communication.md b/aio/content/guide/component-communication.md index 9de8ac338d7..68a6d708473 100644 --- a/aio/content/guide/component-communication.md +++ b/aio/content/guide/component-communication.md @@ -54,7 +54,7 @@ The running application displays three heroes:
- Parent-to-child + Parent-to-child
@@ -98,7 +98,7 @@ Here's the `NameParentComponent` demonstrating name variations including a name
- Parent-to-child-setter + Parent-to-child-setter
@@ -156,7 +156,7 @@ Here's the output of a button-pushing sequence:
- Parent-to-child-onchanges + Parent-to-child-onchanges
@@ -210,7 +210,7 @@ and the method processes it:
- Child-to-parent + Child-to-parent
@@ -272,7 +272,7 @@ Here we see the parent and child working together.
- countdown timer + countdown timer
@@ -424,7 +424,7 @@ facilitated by the service:
- bidirectional-service + bidirectional-service
diff --git a/aio/content/guide/dependency-injection-in-action.md b/aio/content/guide/dependency-injection-in-action.md index dfe12a27ad3..f5c36083900 100644 --- a/aio/content/guide/dependency-injection-in-action.md +++ b/aio/content/guide/dependency-injection-in-action.md @@ -171,7 +171,7 @@ Once all the dependencies are in place, the `AppComponent` displays the user inf
- Logged In User + Logged In User
@@ -337,7 +337,7 @@ Find this example in live co and confirm that the three `HeroBioComponent` instances have their own cached hero data.
- Bios + Bios
@@ -403,7 +403,7 @@ placing it in the `` slot of the `HeroBioComponent` template: It looks like this, with the hero's telephone number from `HeroContactComponent` projected above the hero description:
- bio and contact + bio and contact
@@ -440,7 +440,7 @@ Thanks to `@Optional()`, Angular sets the `loggerService` to null and the rest o Here's the `HeroBiosAndContactsComponent` in action.
- Bios with contact into + Bios with contact into
@@ -450,7 +450,7 @@ until it finds the logger at the `AppComponent` level. The logger logic kicks in with the gratuitous "!!!", indicating that the logger was found.
- Without @Host + Without @Host
@@ -495,7 +495,7 @@ first without a value (yielding the default color) and then with an assigned col The following image shows the effect of mousing over the `` tag.
- Highlighted bios + Highlighted bios
{@a providers} @@ -573,7 +573,7 @@ The `HeroOfTheMonthComponent` example demonstrates many of the alternatives and It's visually simple: a few properties and the logs produced by a logger.
- Hero of the month + Hero of the month
@@ -728,7 +728,7 @@ Now put it to use in a simplified version of the `HeroOfTheMonthComponent`. The `HeroOfTheMonthComponent` constructor's `logger` parameter is typed as `MinimalLogger` so only the `logs` and `logInfo` members are visible in a TypeScript-aware editor:
- MinimalLogger restricted API + MinimalLogger restricted API
@@ -743,7 +743,7 @@ Behind the scenes, Angular actually sets the `logger` parameter to the full serv The following image, which displays the logging date, confirms the point:
- DateLoggerService entry + DateLoggerService entry
@@ -941,7 +941,7 @@ to display a *sorted* list of heroes.
- Sorted Heroes + Sorted Heroes
@@ -1154,7 +1154,7 @@ the same way you've done it before: Here's *Alex* and family in action:
- Alex in action + Alex in action
@@ -1215,7 +1215,7 @@ Here's *Alice*, *Barry* and family in action:
- Alice in action + Alice in action
diff --git a/aio/content/guide/displaying-data.md b/aio/content/guide/displaying-data.md index e40e7010ea7..2f48103595e 100644 --- a/aio/content/guide/displaying-data.md +++ b/aio/content/guide/displaying-data.md @@ -18,7 +18,7 @@ The final UI looks like this:
- Final UI + Final UI
@@ -126,7 +126,7 @@ inside the `` tag. Now run the app. It should display the title and hero name:
- Title and Hero + Title and Hero
@@ -233,7 +233,7 @@ Now the heroes appear in an unordered list.
- After ngfor + After ngfor
diff --git a/aio/content/guide/dynamic-component-loader.md b/aio/content/guide/dynamic-component-loader.md index 33394f68a93..d150eba4945 100644 --- a/aio/content/guide/dynamic-component-loader.md +++ b/aio/content/guide/dynamic-component-loader.md @@ -214,7 +214,7 @@ Here are two sample components and the `AdComponent` interface for reference: The final ad banner looks like this:
- Ads + Ads
diff --git a/aio/content/guide/dynamic-form.md b/aio/content/guide/dynamic-form.md index 1e77491d592..39208799f54 100644 --- a/aio/content/guide/dynamic-form.md +++ b/aio/content/guide/dynamic-form.md @@ -217,7 +217,7 @@ Saving and retrieving the data is an exercise for another time. The final form looks like this:
- Dynamic-Form + Dynamic-Form
diff --git a/aio/content/guide/forms.md b/aio/content/guide/forms.md index ab2a702ac4d..cacde156a33 100644 --- a/aio/content/guide/forms.md +++ b/aio/content/guide/forms.md @@ -60,7 +60,7 @@ You'll learn to build a template-driven form that looks like this:
- Clean Form + Clean Form
@@ -74,7 +74,7 @@ If you delete the hero name, the form displays a validation error in an attentio
- Invalid, Name Required + Invalid, Name Required
@@ -372,7 +372,7 @@ Running the app right now would be disappointing.
- Early form with no binding + Early form with no binding
@@ -456,7 +456,7 @@ At some point it might look like this:
- ngModel in action + ngModel in action
@@ -529,7 +529,7 @@ If you run the app now and change every hero model property, the form might disp
- ngModel in action + ngModel in action
@@ -642,7 +642,7 @@ The actions and effects are as follows:
- Control State Transition + Control State Transition
@@ -651,7 +651,7 @@ You should see the following transitions and class names:
- Control state transitions + Control state transitions
@@ -671,7 +671,7 @@ on the left of the input box:
- Invalid Form + Invalid Form
@@ -705,7 +705,7 @@ When the user deletes the name, the form should look like this:
- Name required + Name required
diff --git a/aio/content/guide/hierarchical-dependency-injection.md b/aio/content/guide/hierarchical-dependency-injection.md index bff7ab40c22..5bb1ee8998a 100644 --- a/aio/content/guide/hierarchical-dependency-injection.md +++ b/aio/content/guide/hierarchical-dependency-injection.md @@ -55,7 +55,7 @@ open simultaneously.
- injector tree + injector tree
@@ -149,7 +149,7 @@ Each tax return component has the following characteristics:
- Heroes in action + Heroes in action
@@ -234,7 +234,7 @@ Component (B) is the parent of another component (C) that defines its own, even
- car components + car components
@@ -247,7 +247,7 @@ its injector produces an instance of `Car` resolved by injector (C) with an `Eng
- car injector tree + car injector tree
diff --git a/aio/content/guide/http.md b/aio/content/guide/http.md index 90739435907..49247f9eb73 100644 --- a/aio/content/guide/http.md +++ b/aio/content/guide/http.md @@ -178,7 +178,7 @@ The app uses the Angular Http client to communicate via **XMLHttpRe It works like this:
- ToH mini app + ToH mini app
@@ -746,7 +746,7 @@ types in a text box:
- Wikipedia search app (v.1) + Wikipedia search app (v.1)
@@ -865,7 +865,7 @@ It should only make requests when the user *stops typing*. Here's how it will work after refactoring:
- Wikipedia search app (v.2) + Wikipedia search app (v.2)
diff --git a/aio/content/guide/learning-angular.md b/aio/content/guide/learning-angular.md index 8b2a759be4b..8dd2a962303 100644 --- a/aio/content/guide/learning-angular.md +++ b/aio/content/guide/learning-angular.md @@ -9,7 +9,7 @@ A suggested path through the documentation for Angular newcomers.
- Us + Us
diff --git a/aio/content/guide/lifecycle-hooks.md b/aio/content/guide/lifecycle-hooks.md index ed49cb6faa1..5f02382852b 100644 --- a/aio/content/guide/lifecycle-hooks.md +++ b/aio/content/guide/lifecycle-hooks.md @@ -9,7 +9,7 @@ Angular calls lifecycle hook methods on directives and components as it creates,
- Us + Us
@@ -465,7 +465,7 @@ The peek-a-boo exists to show how Angular calls the hooks in the expected order. This snapshot reflects the state of the log after the user clicked the *Create...* button and then the *Destroy...* button.
- Peek-a-boo + Peek-a-boo
@@ -549,7 +549,7 @@ with an entry in the *Hook Log* as seen here:
- Spy Directive + Spy Directive
@@ -672,7 +672,7 @@ Here's the sample in action as the user makes changes.
- OnChanges + OnChanges
@@ -718,7 +718,7 @@ so you can see how often `DoCheck` is called. The results are illuminating:
- DoCheck + DoCheck
@@ -795,7 +795,7 @@ for one turn of the browser's JavaScript cycle and that's just long enough. Here's *AfterView* in action:
- AfterView + AfterView
@@ -859,7 +859,7 @@ It tells Angular where to insert that content. In this case, the projected content is the `` from the parent.
- Projected Content + Projected Content
diff --git a/aio/content/guide/pipes.md b/aio/content/guide/pipes.md index 9c0dcb12c6f..a8b85fe0f81 100644 --- a/aio/content/guide/pipes.md +++ b/aio/content/guide/pipes.md @@ -145,7 +145,7 @@ As you click the button, the displayed date alternates between
- Date Format Toggle + Date Format Toggle
@@ -237,7 +237,7 @@ Now you need a component to demonstrate the pipe.
- Power Booster + Power Booster
@@ -285,7 +285,7 @@ your pipe and two-way data binding with `ngModel`.
- Power Boost Calculator + Power Boost Calculator
@@ -372,7 +372,7 @@ code with checkbox switches and additional displays to help you experience these
- Flying Heroes + Flying Heroes
@@ -559,7 +559,7 @@ The component renders as the following:
- Hero List + Hero List
diff --git a/aio/content/guide/reactive-forms.md b/aio/content/guide/reactive-forms.md index 3da2ba3e1e7..d0e2bd16595 100644 --- a/aio/content/guide/reactive-forms.md +++ b/aio/content/guide/reactive-forms.md @@ -353,7 +353,7 @@ Now that everything is wired up, the browser should display something like this:
- Single FormControl + Single FormControl
@@ -457,7 +457,7 @@ Piping it through the `JsonPipe` renders the model as JSON in the browser:
- JSON output + JSON output
@@ -567,7 +567,7 @@ The browser displays the following:
- Single FormControl + Single FormControl
@@ -696,7 +696,7 @@ with the nested address `FormGroup`:
- JSON output + JSON output
@@ -1052,7 +1052,7 @@ Together they look a bit like this:
- HeroListComponent + HeroListComponent
@@ -1265,7 +1265,7 @@ Back in the browser, select the hero named "Magneta".
- JSON output of addresses array + JSON output of addresses array
@@ -1343,7 +1343,7 @@ After you implement both features in this section, the form will look like this:
- Form with save & revert buttons + Form with save & revert buttons
diff --git a/aio/content/guide/router.md b/aio/content/guide/router.md index 59e8d8e3f02..3df9936e07e 100644 --- a/aio/content/guide/router.md +++ b/aio/content/guide/router.md @@ -533,7 +533,7 @@ and the *Heroes* view with its list of heroes.
- Hero List + Hero List
@@ -541,7 +541,7 @@ and the *Heroes* view with its list of heroes. Select one hero and the app takes you to a hero editing screen.
- Crisis Center Detail + Crisis Center Detail
@@ -558,7 +558,7 @@ Now click the *Crisis Center* link for a list of ongoing crises.
- Crisis Center List + Crisis Center List
@@ -571,7 +571,7 @@ Notice that the corresponding name in the crisis list does _not_ change.
- Crisis Center Detail + Crisis Center Detail
@@ -587,7 +587,7 @@ Up pops a dialog box.
- Confirm Dialog + Confirm Dialog
@@ -609,7 +609,7 @@ Proceed to the first application milestone. Begin with a simple version of the app that navigates between two empty views.
- App in action + App in action
@@ -765,7 +765,7 @@ and a *router outlet* where the router swaps views on and off the page. Here's w
- Shell + Shell
@@ -1250,7 +1250,7 @@ Here's how the user will experience this version of the app:
- App in action + App in action
@@ -1880,7 +1880,7 @@ it would be nice if the viewed hero was preselected in the list.
- Selected hero + Selected hero
@@ -2098,7 +2098,7 @@ Look for it within the repeated `
  • ` tag as shown here: When the user navigates from the heroes list to the "Magneta" hero and back, "Magneta" appears selected:
    - Selected List + Selected List
    @@ -2396,7 +2396,7 @@ If your app had many feature areas, the app component trees might look like this
    - Component Tree + Component Tree
    @@ -2695,7 +2695,7 @@ and two buttons, "Send" and "Cancel".
    - Contact popup + Contact popup
    diff --git a/aio/content/guide/security.md b/aio/content/guide/security.md index 83aeeb65dd3..82c06012c79 100644 --- a/aio/content/guide/security.md +++ b/aio/content/guide/security.md @@ -143,7 +143,7 @@ tag but keeps safe content such as the text content of the `