angular-cn/aio/content/guide/example-apps-list.md

Example applications

范例应用

The following is a list of the example applications in the Angular documentation.

下面是 Angular 文档中的范例应用列表。

Fundamentals

基础知识

These examples demonstrate minimal, fundamental concepts.

这些例子演示了一些最小、最基本的概念。

Getting started application

入门应用

Introductory application demonstrating Angular features. For more information, see Getting started.

介绍 Angular 特性的入门级应用。欲知详情，请参阅入门。

Launching your app

启动你的应用

Demonstrates the Angular bootstrapping process. For more information, see Launching your app with a root module.

演示了 Angular 的启动过程。欲知详情，请参阅使用根模块启动应用。

Structure of Angular applications

Angular 应用的结构

Demonstrates the fundamental architecture of Angular applications. For more information, see Introduction to Angular concepts.

演示了 Angular 应用的基本架构。欲知详情，请参阅Angular 概念简介。

Setting the document title

设置文档标题

Demonstrates customizing the document title in the browser. For more information, see Set the document title.

演示了如何在浏览器中自定义文档标题。欲知详情，请参阅设置文档标题。

Tour of Heroes tutorial application

英雄之旅教程

The Tour of Heroes is a comprehensive tutorial that guides you through the process of building an application with many of Angular's most popular features.

“英雄之旅”是一本全面的教程，可以指导你使用 Angular 中很多最常用的特性来构建一个应用程序。

Tour of Heroes: completed application

英雄之旅：完成后的应用

Completed Tour of Heroes example application. For more information, see Tour of Heroes app and tutorial.

完成后的英雄之旅范例应用。欲知详情，请参阅“英雄之旅”应用和教程。

Tour of Heroes: Creating an application

英雄之旅：创建一个应用

Initial Tour of Heroes example application for beginning the tutorial. For more information, see Create a new project.

初始的英雄之旅范例应用，从这里开始本教程。欲知详情，请参阅创建新项目。

Tour of Heroes: The hero editor

英雄之旅：英雄编辑器

First step of the Tour of Heroes example application. For more information, see The hero editor.

“英雄之旅”范例应用中的第一步。欲知详情，请参阅英雄编辑器。

Tour of Heroes: Display a selection list

英雄之旅：显示一个选取列表

Second step of the Tour of Heroes example application. For more information, see Display a selection list.

“英雄之旅”范例应用中的第二步。欲知详情，请参阅显示选择列表。

Tour of Heroes: Create a feature component

英雄之旅：创建一个特性组件

Third step of the Tour of Heroes example application. For more information, see Create a feature component.

“英雄之旅”范例应用中的第三步。欲知详情，请参阅创建要素组件。

Tour of Heroes: Add services

英雄之旅：添加服务

Fourth step of the Tour of Heroes example application. For more information, see Add services.

“英雄之旅”范例应用中的第四步。欲知详情，请参阅添加服务。

Tour of Heroes: Add in-app navigation with routing

英雄之旅：用路由添加应用内导航

Fifth step of the Tour of Heroes example application. For more information, see Add in-app navigation with routing.

“英雄之旅”范例应用中的第五步。欲知详情，请参阅使用路由添加应用内导航。

Tour of Heroes: Get data from a server

英雄之旅：从服务器上获取数据

Sixth and final step of the Tour of Heroes example application. For more information, see Get data from a server.

“英雄之旅”范例应用中的第六步也是最后一步。欲知详情，请参阅从服务器获取数据。

Working with templates

使用模板

These examples demonstrate features of Angular templates.

这些例子演示了 Angular 模板的各种特性。

Accessibility

无障碍化

Demonstrates building Angular applications in a more accessible way. For more information, see Accessibility.

演示了如何以更易于访问（无障碍）的方式构建 Angular 应用。欲知详情，请参阅辅助功能。

Animations

动画片

Demonstrates Angular's animation features. For more information, see Introduction to Angular animations.

演示了 Angular 的动画特性。欲知详情，请参阅Angular 动画简介。

Attribute, class, and style bindings

属性，类和样式绑定

Demonstrates Angular attribute, class, and style bindings. For more information, see Attribute, class, and style bindings.

演示了 Angular 的属性绑定、类绑定和样式绑定。欲知详情，请参阅属性，类和样式绑定。

Attribute directives

属性型指令

Demonstrates Angular attribute directives. For more information, see Attribute directives.

展示了 Angular 的属性型指令。欲知详情，请参阅属性型指令。

Binding syntax

绑定语法

Demonstrates Angular's binding syntax. For more information, see Binding syntax: an overview.

演示了 Angular 的绑定语法。欲知详情，请参阅绑定语法：概述。

Built-in directives

内置指令

Demonstrates Angular built-in directives. For more information, see Built-in directives.

演示了 Angular 的内置指令。欲知详情，请参阅内置指令。

Built-in template functions

内置模板函数

Demonstrates Angular built-in template functions. For more information, see the $any() type cast function section of Template expression operators.

演示了 Angular 的内置模板函数。欲知详情，请参阅 Template 表达式运算符中的 $any() 类型转换函数部分。

Interpolation

插值

Demonstrates Angular interpolation. For more information, see Interpolation and template expressions.

演示了 Angular 的插值。欲知详情，请参阅插值和模板表达式。

Template expression operators

模板表达运算符

Demonstrates expression operators in Angular templates. For more information, see Template expression operators.

演示了 Angular 模板中的表达式运算符。欲知详情，请参阅模板表达式运算符

Template reference variables

模板引用变量

Demonstrates Angular's template reference variables. For more information, see Template reference variables.

演示了 Angular 的模板引用变量。欲知详情，请参阅模板引用变量。

<ngcontainer>

Demonstrates <ngcontainer>. For more information, see the ngtemplate section of Structural directives .

演示了 <ngcontainer> 。欲知详情，请参阅结构型指令中的 ngtemplate 部分。

Pipes

管道

Demonstrates Angular pipes. For more information, see Transforming Data Using Pipes.

演示了 Angular 管道。欲知详情，请参阅使用管道转换数据。

Property binding

属性绑定

Demonstrates property binding in Angular. For more information, see Property binding.

演示了 Angular 中的属性绑定。欲知详情，请参阅属性绑定。

Structural directives

结构型指令

Demonstrates Angular structural directives. For more information, see Structural directives.

演示了 Angular 的结构型指令。欲知详情，请参阅结构型指令。

Two-way binding

双向绑定

Demonstrates two-way data binding in Angular applications. For more information, see Two-way binding.

演示了 Angular 应用中的双向数据绑定。欲知详情，请参阅双向绑定。

Template syntax

模板语法

Comprehensive demonstration of Angular's template syntax. For more information, see Template reference variables.

全面演示了 Angular 的模板语法。欲知详情，请参阅模板引用变量。

User input

用户输入

Demonstrates responding to user actions. For more information, see User input.

演示了如何响应用户操作。欲知详情，请参阅用户输入。

Working with components

使用组件

These examples demonstrate features of Angular components.

这些例子展示了 Angular 组件的各种特性。

Component interaction

组件交互

Demonstrates how Angular shares data between components. For more information, see Component interaction.

演示 Angular 如何在组件之间共享数据。欲知详情，请参阅组件交互。

Component styles

组件样式

Demonstrates styling in Angular apps. For more information, see Component styles.

演示了 Angular 应用中的样式。欲知详情，请参阅组件样式。

Dynamic component loader

动态组件加载器

Demonstrates how to dynamically load components. For more information, see Dynamic component loader.

演示了如何动态加载组件。欲知详情，请参阅动态组件加载器。

Elements

自定义元素

Demonstrates using Angular custom elements. For more information, see Angular elements overview.

演示如何使用 Angular 自定义元素。欲知详情，请参阅 Angular 自定义元素概览 。

Event binding

事件绑定

Demonstrates binding to events in Angular. For more information, see Event binding.

演示了如何绑定 Angular 中的事件。欲知详情，请参阅事件绑定。

@Input() and @Output()

Demonstrates @Input() and @Output() in components and directives. For more information, see @Input() and @Output() properties.

演示了组件和指令中的 @Input() 和 @Output()。欲知详情，请参阅 @Input() 和 @Output() 属性。

Lifecycle hooks

生命周期钩子

Demonstrates Angular lifecycle hooks such as ngOnInit() and ngOnChanges(). For more information, see Hooking into the component lifecycle.

演示了 Angular 的生命周期钩子，比如 ngOnInit() 和 ngOnChanges() 。欲知详情，请参阅钩入组件生命周期。

Dependency injection

依赖注入

Dependency injection fundamentals

依赖注入的基础知识

Demonstrates fundamentals of Angular dependency injection. For more information, see Dependency injection.

展示了 Angular 依赖注入的基础知识。欲知详情，请参阅依赖注入。

Dependency injection features

依赖注入特性

Demonstrates many of the features of Angular dependency injection. For more information, see Dependency injection in action.

演示了 Angular 依赖注入的很多特性。欲知详情，请参阅“依赖注入” 。

Providing dependencies in NgModules

在 NgModules 中提供依赖

Demonstrates providing services in NgModules. For more information, see Providing dependencies in modules.

演示如何在 NgModules 中提供服务。欲知详情，请参阅在模块中提供依赖项。

Hierarchical dependency injection

分层依赖注入

Demonstrates Angular injector trees and resolution modifiers. For more information, see Hierarchical injectors.

演示了 Angular 的注入器树和解析修饰器。欲知详情，请参阅分层注入器。

Dependency injection with providers and viewProviders

使用 providers 和 viewProviders 进行依赖注入

Demonstrates how providers and viewproviders affect dependency injection. For more information, see the Providing services in @Component() section of Hierarchical injectors.

演示了 providers 和 viewproviders 如何影响依赖注入。欲知详情，请参阅分层注入器中的在 @Component() 中提供服务部分。

Resolution modifiers and dependency injection

解析修饰器和依赖注入

Demonstrates Angular's resolution modifiers, such as @Self(). For more information, see the Modifying service visibility section of Hierarchical injectors.

演示了 Angular 的解析修饰器，比如 @Self() 。关于详细信息，请参阅“分层注入器”中的“修改服务可见性”部分。

Forms

表单

Forms overview

表单概述

Demonstrates foundational concepts of Angular forms. For more information, see Introduction to forms in Angular.

演示了 Angular 表达式的基本概念。欲知详情，请参阅 Angular 中的表单简介。

Reactive forms

响应式表单

Demonstrates Angular's reactive forms. For more information, see Reactive forms.

演示了 Angular 中的响应式表单。欲知详情，请参阅响应式表单。

Template-driven forms

模板驱动表单

Demonstrates Angular template-driven forms. For more information, see Building a template-driven form.

演示了 Angular 中的模板驱动表单。欲知详情，请参阅构建模板驱动表单。

Form validation

表单验证

Demonstrates validating forms in Angular. For more information, see Validating form input.

演示了在 Angular 中验证表单的方法。欲知详情，请参阅验证表单输入。

Dynamic forms

动态表单

Demonstrates creating dynamic forms. For more information, see Building dynamic forms.

演示了如何创建动态表单。欲知详情，请参阅构建动态表单。

NgModules

NgModules

Demonstrates fundamentals of NgModules. For more information, see NgModules.

演示了 NgModules 的基础知识。欲知详情，请参阅NgModules 。

Feature modules

特性模块

Demonstrates using feature modules in Angular. For more information, see Feature modules.

演示了如何在 Angular 中使用特性模块。欲知详情，请参阅特性模块。

Lazy loading NgModules

惰性加载 NgModules

Demonstrates lazy loading NgModules. For more information, see Lazy-loading feature modules.

演示了 NgModules 的惰性加载。欲知详情，请参阅惰性加载特性模块。

Routing

路由

Router

路由器

Demonstrates Angular's routing features. For more information, see Router.

演示了 Angular 的路由特性。欲知详情，请参阅路由器。

Router tutorial

路由器教程

Demonstrates Angular's fundamental routing techniques. For more information, see Using Angular routes in a single-page application.

演示了 Angular 中的基本路由技巧。欲知详情，请参阅在单页面应用程序中使用 Angular 路由。

Style guide for Documentation contributions

给文档贡献者的风格指南

Demonstrates Angular documentation style guidelines. For more information, see Angular documentation style guide.

演示了 Angular 的文档风格指南。欲知详情，请参阅Angular 文档风格指南。

Server communication

与服务器通信

HttpClient

Demonstrates server interaction using HTTP. For more information, see Communicating with backend services using HTTP.

演示了如何通过 HTTP 与服务器交互。欲知详情，请参阅使用 HTTP 与后端服务进行通信。

Workflow

工作流

Security

安全

Demonstrates security concepts in Angular applications. For more information, see Security.

演示了 Angular 应用中的各种安全概念。欲知详情，请参阅安全性。

Testing

测试

For the sample app that the testing guides describe, see the sample app.

对于测试指南中描述的范例应用，参阅 sample app。

For the tests featured in the testing guides, see tests.

对于测试指南中的测试，参阅 tests。

Demonstrates techniques for testing Angular. For more information, see Testing.

演示了用来测试 Angular 的技巧。欲知详情，请参阅测试。

Hybrid Angular applications

混合 Angular 应用

AngularJS to Angular concepts: Quick reference

AngularJS 到 Angular 的概念变迁：快速参考

Demonstrates Angular for those with an AngularJS background. For more information, see AngularJS to Angular concepts: Quick reference.

为具有 AngularJS 背景的人演示 Angular。要了解更多信息，请参阅 AngularJS 到 Angular 的概念变迁：快速参考。