docs(aio): remove hardcoded TOC
This commit is contained in:
Jesús Rodríguez
Matias Niemelä
parent
cd28df627c
commit
03610526e5
|
|
@ -19,6 +19,7 @@ by mapping AngularJS syntax to the equivalent Angular syntax.
|
|||
|
||||
**See the Angular syntax in this <live-example name="ajs-quick-reference"></live-example>**.
|
||||
|
||||
<!--
|
||||
## Contents
|
||||
|
||||
* [Template basics](guide/ajs-quick-reference#template-basics)—binding and local variables.
|
||||
|
|
@ -30,7 +31,7 @@ by mapping AngularJS syntax to the equivalent Angular syntax.
|
|||
* [Modules/controllers/components](guide/ajs-quick-reference#controllers-components)—*modules* in Angular are slightly different from *modules* in AngularJS, and *controllers* are *components* in Angular.
|
||||
|
||||
* [Style sheets](guide/ajs-quick-reference#style-sheets)—more options for CSS than in AngularJS.
|
||||
|
||||
-->
|
||||
|
||||
|
||||
## Template basics
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ This cookbook describes how to radically improve performance by compiling _ahead
|
|||
during a build process.
|
||||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
# Contents
|
||||
|
||||
* [Overview](guide/aot-compiler#overview)
|
||||
|
|
@ -33,6 +33,8 @@ during a build process.
|
|||
* [Running the application](guide/aot-compiler#running-app)
|
||||
* [Inspect the Bundle](guide/aot-compiler#inspect-bundle)
|
||||
|
||||
-->
|
||||
|
||||
{@a overview}
|
||||
|
||||
## Overview
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ You'll learn the details in the pages that follow. For now, focus on the big pic
|
|||
<img src="generated/images/guide/architecture/overview2.png" alt="overview" style="margin-left:-40px;" width="700"></img>
|
||||
</figure>
|
||||
|
||||
|
||||
<!--
|
||||
|
||||
The architecture diagram identifies the eight main building blocks of an Angular application:
|
||||
|
||||
|
|
@ -44,7 +44,7 @@ The architecture diagram identifies the eight main building blocks of an Angular
|
|||
* [Dependency injection](guide/architecture#dependency-injection)
|
||||
|
||||
Learn these building blocks, and you're on your way.
|
||||
|
||||
-->
|
||||
|
||||
<div class="l-sub-section">
|
||||
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ Attribute directives attach behavior to elements.
|
|||
|
||||
An **Attribute** directive changes the appearance or behavior of a DOM element.
|
||||
|
||||
<!--
|
||||
# Contents
|
||||
|
||||
* [Directives overview](guide/attribute-directives#directive-overview)
|
||||
|
|
@ -19,6 +20,8 @@ An **Attribute** directive changes the appearance or behavior of a DOM element.
|
|||
* [Pass values into the directive with an _@Input_ data binding](guide/attribute-directives#bindings)
|
||||
* [Bind to a second property](guide/attribute-directives#second-property)
|
||||
|
||||
-->
|
||||
|
||||
Try the <live-example title="Attribute Directive example"></live-example>.
|
||||
|
||||
{@a directive-overview}
|
||||
|
|
|
|||
|
|
@ -19,6 +19,8 @@ benefit _every_ Angular project.
|
|||
By the end of the chapter, you'll have a basic understanding of development with the CLI
|
||||
and a foundation for both these documentation samples and for real world applications.
|
||||
|
||||
<!--
|
||||
|
||||
You'll pursue these ends in the following high-level steps:
|
||||
|
||||
1. [Set up](guide/cli-quickstart#devenv) the development environment.
|
||||
|
|
@ -26,6 +28,8 @@ You'll pursue these ends in the following high-level steps:
|
|||
3. [Serve](guide/cli-quickstart#serve) the application.
|
||||
4. [Edit](guide/cli-quickstart#first-component) the application.
|
||||
|
||||
-->
|
||||
|
||||
And you can also <a href="generated/zips/cli-quickstart/cli-quickstart.zip" target="_blank">download the example.</a>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -11,6 +11,8 @@ This cookbook contains recipes for common component communication scenarios
|
|||
in which two or more components share information.
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
* [Pass data from parent to child with input binding](guide/component-communication#parent-to-child)
|
||||
|
|
@ -19,7 +21,7 @@ in which two or more components share information.
|
|||
* [Parent calls an `@ViewChild()`](guide/component-communication#parent-to-view-child)
|
||||
* [Parent and children communicate via a service](guide/component-communication#bidirectional-service)
|
||||
|
||||
|
||||
-->
|
||||
|
||||
**See the <live-example name="component-communication"></live-example>**.
|
||||
|
||||
|
|
|
|||
|
|
@ -17,6 +17,8 @@ with components, enabling a more modular design than regular stylesheets.
|
|||
|
||||
This page describes how to load and apply these component styles.
|
||||
|
||||
<!--
|
||||
|
||||
## Table Of Contents
|
||||
|
||||
* [Using component styles](guide/component-styles#using-component-styles)
|
||||
|
|
@ -26,6 +28,8 @@ This page describes how to load and apply these component styles.
|
|||
* [Appendix 1: Inspecting the CSS generated in emulated view encapsulation](guide/component-styles#inspect-generated-css)
|
||||
* [Appendix 2: Loading styles with relative URLs](guide/component-styles#relative-urls)
|
||||
|
||||
-->
|
||||
|
||||
You can run the <live-example></live-example> in Plunker and download the code from there.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -11,6 +11,8 @@ Dependency Injection is a powerful pattern for managing code dependencies.
|
|||
This cookbook explores many of the features of Dependency Injection (DI) in Angular.
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
* [Application-wide dependencies](guide/dependency-injection-in-action#app-wide-dependencies)
|
||||
|
|
@ -52,6 +54,7 @@ This cookbook explores many of the features of Dependency Injection (DI) in Angu
|
|||
|
||||
* [Break circularities with a forward class reference (*forwardRef*)](guide/dependency-injection-in-action#forwardref)
|
||||
|
||||
-->
|
||||
|
||||
See the <live-example name="dependency-injection-in-action"></live-example>
|
||||
of the code in this cookbook.
|
||||
|
|
|
|||
|
|
@ -16,6 +16,8 @@ It's used so widely that almost everyone just calls it _DI_.
|
|||
This page covers what DI is, why it's so useful,
|
||||
and [how to use it](guide/dependency-injection#angular-di) in an Angular app.
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
* [Why dependency injection?](guide/dependency-injection#why-di)
|
||||
|
|
@ -51,6 +53,8 @@ and [how to use it](guide/dependency-injection#angular-di) in an Angular app.
|
|||
* [Summary](guide/dependency-injection#summary)
|
||||
* [Appendix: Working with injectors directly](guide/dependency-injection#explicit-injector)
|
||||
|
||||
-->
|
||||
|
||||
Run the <live-example></live-example>.
|
||||
|
||||
{@a why-di }
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ This page describes tools and techniques for deploy and optimize your Angular ap
|
|||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
## Table of contents
|
||||
|
||||
|
|
@ -31,6 +32,7 @@ This page describes tools and techniques for deploy and optimize your Angular ap
|
|||
* [Routed apps must fallback to `index.html`](guide/deployment#fallback)
|
||||
* [CORS: requesting services from a different server](guide/deployment#cors)
|
||||
|
||||
-->
|
||||
|
||||
{@a overview}
|
||||
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ The final UI looks like this:
|
|||
<img src="generated/images/guide/displaying-data/final.png" alt="Final UI"></img>
|
||||
</figure>
|
||||
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
|
|
@ -29,6 +29,7 @@ The final UI looks like this:
|
|||
* [Showing an array property with NgFor](guide/displaying-data#ngFor).
|
||||
* [Conditional display with NgIf](guide/displaying-data#ngIf).
|
||||
|
||||
-->
|
||||
|
||||
<div class="l-sub-section">
|
||||
|
||||
|
|
|
|||
|
|
@ -13,6 +13,8 @@ This cookbook shows you how to use `ComponentFactoryResolver` to add components
|
|||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
* [Dynamic component loading](guide/dynamic-component-loader#dynamic-loading)
|
||||
|
|
@ -25,6 +27,7 @@ This cookbook shows you how to use `ComponentFactoryResolver` to add components
|
|||
* [A common _AdComponent_ interface](guide/dynamic-component-loader#common-interface)
|
||||
* [Final ad banner](guide/dynamic-component-loader#final-ad-banner)
|
||||
|
||||
-->
|
||||
|
||||
See the <live-example name="dynamic-component-loader"></live-example>
|
||||
of the code in this cookbook.
|
||||
|
|
|
|||
|
|
@ -27,6 +27,8 @@ The agency is constantly tinkering with the application process.
|
|||
You can create the forms on the fly *without changing the application code*.
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
* [Bootstrap](guide/dynamic-form#bootstrap)
|
||||
* [Question model](guide/dynamic-form#object-model)
|
||||
|
|
@ -34,6 +36,7 @@ You can create the forms on the fly *without changing the application code*.
|
|||
* [Questionnaire data](guide/dynamic-form#questionnaire-data)
|
||||
* [Dynamic template](guide/dynamic-form#dynamic-template)
|
||||
|
||||
-->
|
||||
|
||||
See the <live-example name="dynamic-form"></live-example>.
|
||||
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@ and the [Reactive Forms](guide/reactive-forms) guides.
|
|||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
## Contents
|
||||
|
||||
|
|
@ -54,6 +55,7 @@ and the [Reactive Forms](guide/reactive-forms) guides.
|
|||
|
||||
* [Testing considerations](guide/form-validation#testing)
|
||||
|
||||
-->
|
||||
|
||||
{@a live-example}
|
||||
|
||||
|
|
|
|||
|
|
@ -28,6 +28,8 @@ Modern browsers support two HTTP-based APIs:
|
|||
|
||||
The Angular HTTP library simplifies application programming with the **XHR** and **JSONP** APIs.
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
* [Demos](guide/http#demos)
|
||||
|
|
@ -77,6 +79,8 @@ The Angular HTTP library simplifies application programming with the **XHR** and
|
|||
* [Override default request headers (and other request options)](guide/http#override-default-request-options)
|
||||
* [Appendix: Tour of Heroes _in-memory web api_](guide/http#in-mem-web-api)
|
||||
|
||||
-->
|
||||
|
||||
A <live-example>live example</live-example> illustrates these topics.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -12,6 +12,8 @@ Translate the app's template text into multiple languages.
|
|||
|
||||
Angular's _internationalization_ (_i18n_) tools help make your app available in multiple languages.
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
* [Angular and i18n template translation](guide/i18n#angular-i18n)
|
||||
|
|
@ -40,6 +42,7 @@ Angular's _internationalization_ (_i18n_) tools help make your app available in
|
|||
* [Internationalization with the AOT compiler](guide/i18n#aot)
|
||||
* [Translation file maintenance and _id_ changes](guide/i18n#maintenance)
|
||||
|
||||
-->
|
||||
|
||||
Try this <live-example name="i18n" title="i18n Example in Spanish">live example</live-example>
|
||||
of a JIT-compiled app, translated into Spanish.
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@ that provide visibility into these key life moments and the ability to act when
|
|||
A directive has the same set of lifecycle hooks, minus the hooks that are specific to component content and views.
|
||||
<br class="l-clear-both">
|
||||
|
||||
<!--
|
||||
|
||||
## Contents
|
||||
|
||||
|
|
@ -54,6 +55,7 @@ A directive has the same set of lifecycle hooks, minus the hooks that are specif
|
|||
|
||||
Try the <live-example></live-example>.
|
||||
|
||||
-->
|
||||
|
||||
{@a hooks-overview}
|
||||
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ These FAQs assume that you have read the [NgModules](guide/ngmodule) page.
|
|||
|
||||
</div>
|
||||
|
||||
|
||||
<!--
|
||||
|
||||
Declarations
|
||||
|
||||
|
|
@ -78,7 +78,7 @@ General
|
|||
|
||||
<hr/>
|
||||
|
||||
|
||||
-->
|
||||
|
||||
{@a q-what-to-declare}
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ of creating and maintaining a single root `AppModule` for the entire application
|
|||
|
||||
This page covers NgModules in greater depth.
|
||||
|
||||
<!-- CF: See my comment in the "Resolve directive conflicts" section below proposing renaming or reorganizing that section. -->
|
||||
<!-- CF: See my comment in the "Resolve directive conflicts" section below proposing renaming or reorganizing that section.
|
||||
|
||||
* [Angular modularity](guide/ngmodule#angular-modularity "Add structure to the app with NgModule")
|
||||
* [The application root module](guide/ngmodule#root-module "The startup module that every app requires")
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ This guide explains reactive forms as you follow the steps to build a "Hero Deta
|
|||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
## Contents
|
||||
|
||||
|
|
@ -34,6 +35,8 @@ This guide explains reactive forms as you follow the steps to build a "Hero Deta
|
|||
* [Observe control changes](guide/reactive-forms#observe-control)
|
||||
* [Save form data](guide/reactive-forms#save)
|
||||
|
||||
-->
|
||||
|
||||
Try the <live-example plnkr="final" title="Reactive Forms (final) in Plunker">Reactive Forms live-example</live-example>.
|
||||
|
||||
You can also run the <live-example title="Reactive Forms Demo in Plunker">Reactive Forms Demo</live-example> version
|
||||
|
|
|
|||
|
|
@ -33,6 +33,7 @@ You can navigate imperatively when the user clicks a button, selects from a drop
|
|||
or in response to some other stimulus from any source. And the router logs activity
|
||||
in the browser's history journal so the back and forward buttons work as well.
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
|
|
@ -133,7 +134,7 @@ in the browser's history journal so the back and forward buttons work as well.
|
|||
* [Appendix: *LocationStrategy* and browser URL styles](guide/router#location-strategy)
|
||||
|
||||
|
||||
|
||||
-->
|
||||
|
||||
|
||||
{@a basics}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ this user?_) and authorization (_What can this user do?_).
|
|||
|
||||
For more information about the attacks and mitigations described below, see [OWASP Guide Project](https://www.owasp.org/index.php/Category:OWASP_Guide_Project).
|
||||
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
|
|
@ -26,6 +26,7 @@ For more information about the attacks and mitigations described below, see [OWA
|
|||
* [HTTP-Level vulnerabilities](guide/security#http).
|
||||
* [Auditing Angular applications](guide/security#code-review).
|
||||
|
||||
-->
|
||||
|
||||
You can run the <live-example></live-example> in Plunker and download the code from there.
|
||||
|
||||
|
|
|
|||
|
|
@ -19,6 +19,9 @@ maintained [on github](https://github.com/angular/quickstart "Install the github
|
|||
|
||||
|
||||
Make sure you have [node and npm installed](guide/setup#install-prerequisites "What if you don't have node and npm?").
|
||||
|
||||
<!--
|
||||
|
||||
Then ...
|
||||
|
||||
1. Create a project folder (you can call it `quickstart` and rename it later).
|
||||
|
|
@ -26,6 +29,7 @@ Then ...
|
|||
1. Install [npm](guide/setup#install-prerequisites "What if you don't have node and npm?") packages.
|
||||
1. Run `npm start` to launch the sample application.
|
||||
|
||||
-->
|
||||
|
||||
{@a clone}
|
||||
|
||||
|
|
|
|||
|
|
@ -19,6 +19,8 @@ Angular has a powerful template engine that lets us easily manipulate the DOM st
|
|||
This guide looks at how Angular manipulates the DOM with **structural directives** and
|
||||
how you can write your own structural directives to do the same thing.
|
||||
|
||||
<!--
|
||||
|
||||
### Table of contents
|
||||
|
||||
* [What are structural directives?](guide/structural-directives#definition)
|
||||
|
|
@ -36,6 +38,7 @@ how you can write your own structural directives to do the same thing.
|
|||
* [Group sibling elements with <ng-container>](guide/structural-directives#ng-container)
|
||||
* [Write a structural directive](guide/structural-directives#unless)
|
||||
|
||||
-->
|
||||
|
||||
Try the <live-example></live-example>.
|
||||
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ This style guide presents preferred conventions and, as importantly, explains wh
|
|||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
# Contents
|
||||
|
||||
|
|
@ -29,7 +30,7 @@ This style guide presents preferred conventions and, as importantly, explains wh
|
|||
* [Lifecycle hooks](guide/styleguide#lifecycle-hooks)
|
||||
* [Appendix](guide/styleguide#appendix)
|
||||
|
||||
|
||||
-->
|
||||
|
||||
## Style vocabulary
|
||||
|
||||
|
|
|
|||
|
|
@ -26,6 +26,8 @@ In Angular, the component plays the part of the controller/viewmodel, and the te
|
|||
|
||||
{@a toc}
|
||||
|
||||
<!--
|
||||
|
||||
|
||||
### Contents
|
||||
|
||||
|
|
@ -70,7 +72,7 @@ demonstrates all of the syntax and code snippets described in this guide.
|
|||
|
||||
<hr/>
|
||||
|
||||
|
||||
-->
|
||||
|
||||
{@a html}
|
||||
|
||||
|
|
|
|||
|
|
@ -15,6 +15,8 @@ the focus is on testing applications written with Angular.
|
|||
|
||||
{@a top}
|
||||
|
||||
<!--
|
||||
|
||||
|
||||
# Contents
|
||||
|
||||
|
|
@ -128,6 +130,8 @@ the focus is on testing applications written with Angular.
|
|||
|
||||
It’s a big agenda. Fortunately, you can learn a little bit at a time and put each lesson to use.
|
||||
|
||||
-->
|
||||
|
||||
## Live examples
|
||||
|
||||
This guide presents tests of a sample application that is much like the [_Tour of Heroes_ tutorial](tutorial).
|
||||
|
|
|
|||
|
|
@ -32,6 +32,8 @@ business, because the work can be done collaboratively and spread over
|
|||
a period of time. The `upgrade` module in Angular has been designed to
|
||||
make incremental upgrading seamless.
|
||||
|
||||
<!--
|
||||
|
||||
1. [Preparation](guide/upgrade#preparation)
|
||||
|
||||
1. [Follow the Angular Style Guide](guide/upgrade#follow-the-angular-styleguide)
|
||||
|
|
@ -65,7 +67,7 @@ make incremental upgrading seamless.
|
|||
|
||||
3. [Appendix: Upgrading PhoneCat Tests](guide/upgrade#appendix-upgrading-phonecat-tests)
|
||||
|
||||
|
||||
-->
|
||||
|
||||
## Preparation
|
||||
|
||||
|
|
|
|||
|
|
@ -30,6 +30,8 @@ the QuickStart application itself.
|
|||
To set up the QuickStart files with an **ASP.NET 4.x project** in
|
||||
Visual Studio 2015, follow these steps:
|
||||
|
||||
<!--
|
||||
|
||||
|
||||
* [Prerequisite](guide/visual-studio-2015#prereq1): Install Node.js.
|
||||
* [Prerequisite](guide/visual-studio-2015#prereq2): Install Visual Studio 2015 Update 3.
|
||||
|
|
@ -41,6 +43,7 @@ Visual Studio 2015, follow these steps:
|
|||
* [Step 4](guide/visual-studio-2015#restore): Restore required packages.
|
||||
* [Step 5](guide/visual-studio-2015#build-and-run): Build and run the app.
|
||||
|
||||
-->
|
||||
|
||||
<div class="l-sub-section">
|
||||
|
||||
|
|
|
|||
|
|
@ -25,6 +25,8 @@ This guide offers a taste of Webpack and explains how to use it with Angular app
|
|||
|
||||
{@a top}
|
||||
|
||||
<!--
|
||||
|
||||
|
||||
# Contents
|
||||
|
||||
|
|
@ -57,6 +59,8 @@ This guide offers a taste of Webpack and explains how to use it with Angular app
|
|||
* [Highlights](guide/webpack#highlights)
|
||||
* [Conclusion](guide/webpack#conclusion)
|
||||
|
||||
-->
|
||||
|
||||
You can also <a href="generated/zips/webpack/webpack.zip" target="_blank">download the final result.</a>
|
||||
|
||||
{@a what-is-webpack}
|
||||
|
|
|
|||
Loading…
Reference in New Issue