Guide首页完成了大部分

This commit is contained in:
Zhicheng Wang 2016-04-20 00:18:04 +08:00
parent c8041a0bf2
commit da8bf0efb9
1 changed files with 61 additions and 7 deletions

View File

@ -8,8 +8,12 @@ figure
This is a practical guide to Angular for experienced programmers who This is a practical guide to Angular for experienced programmers who
are building client applications in HTML and #{langName}. are building client applications in HTML and #{langName}.
这是一个Angular实战指南。面向的是正在使用HTML和#{langName}构建客户端应用的有经验的程序员。
We are on a journey together to understand how Angular works and, more importantly, We are on a journey together to understand how Angular works and, more importantly,
how to make it work for us. This overview begins the journey. how to make it work for us. This overview begins the journey.
在这次旅程中我们将一起理解Angular是如何工作的以及 —— 更重要的 —— 如何让它为我们工作。此概览就是本次旅程的起点。
<br clear="all"> <br clear="all">
// #enddocregion intro // #enddocregion intro
@ -17,9 +21,12 @@ figure
<a id="learning-path"></a> <a id="learning-path"></a>
:marked :marked
# Organization # Organization
# 组织结构
The documentation is divided into major thematic sections, each The documentation is divided into major thematic sections, each
a collection of chapters devoted to that theme. a collection of chapters devoted to that theme.
本文档被分成了几个主题区域,每一组中的章节都是围绕所属主题的。
// #enddocregion how-to-read-1 // #enddocregion how-to-read-1
// #docregion how-to-read-2 // #docregion how-to-read-2
- var top="vertical-align:top" - var top="vertical-align:top"
@ -27,7 +34,7 @@ table(width="100%")
col(width="15%") col(width="15%")
col col
tr(style=top) tr(style=top)
td <b>Tutorial</b> td <b>Tutorial</b> <b>教程</b>
td td
:marked :marked
A step-by-step, immersive approach to learning Angular. A step-by-step, immersive approach to learning Angular.
@ -35,71 +42,118 @@ table(width="100%")
the foundation for every chapter and sample in this documentation, the foundation for every chapter and sample in this documentation,
followed by the [*Tour of Heroes* tutorial](../tutorial) that followed by the [*Tour of Heroes* tutorial](../tutorial) that
introduces the major features of Angular in an application context. introduces the major features of Angular in an application context.
一个按部就班、沉浸式的Angular学习之旅。
从[QuickStart](../quickstart.html)开始,本文档中的每一个章节和范例,都基于一个[*英雄指南* 教程](../tutorial)
它会在一个假想的应用场景中逐步引出Angular的各个主要特性。
tr(style=top) tr(style=top)
td <b>Basics</b> td <b>Basics</b> <b>基础</b>
td td
:marked :marked
The essential ingredients of Angular development. The essential ingredients of Angular development.
Angular开发中必不可少的要素。
tr(style=top) tr(style=top)
td <b>Developer Guide</b> td <b>Developer Guide</b> <b>开发人员指南</b>
td td
:marked :marked
In depth analysis of Angular features and development practices. In depth analysis of Angular features and development practices.
深入分析Angular的特性和开发实践。
tr(style=top) tr(style=top)
td <b>Cookbook</b> td <b>Cookbook</b> <b>菜谱</b>
td td
:marked :marked
Recipes for specific application challenges, mostly code snippets with a minimum of exposition. Recipes for specific application challenges, mostly code snippets with a minimum of exposition.
解决实际应用中某些特定挑战的食谱,大部分是代码片段,以及少量的详细阐述。
tr(style=top) tr(style=top)
td <b>Reference</b> td <b>Reference</b> <b>参考</b>
td td
:marked :marked
Angular-specific reference material, most notably the [API Guide](../api) Angular-specific reference material, most notably the [API Guide](../api)
with its authoritative details about each member in the Angular libraries. with its authoritative details about each member in the Angular libraries.
Angular特有的参考资料最受欢迎的[API 指南](../api)包括Angular库中每一个成员的权威资料。
tr(style=top) tr(style=top)
td <b>Resources</b> td <b>Resources</b> <b>资源</b>
td td
:marked :marked
Other places to go for help and information. Other places to go for help and information.
可用来获得帮助和获取消息的其它去处。
:marked :marked
# Learning Path # Learning Path
# 学习路径
We don't have to read the guide straight through. Most chapters stand on their own. We don't have to read the guide straight through. Most chapters stand on their own.
我们并不需要从头到尾的阅读本指南。大部分章节都是独立的。
We recommend a learning path for those new to Angular. We recommend a learning path for those new to Angular.
Most of that path runs through the *Basics* section: Most of that path runs through the *Basics* section:
我们推荐一个给Angular新手的学习路径。
这条路径的大部分章节都在 *基础知识* 区。
1. Read the [Architecture Overview](architecture.html) to get the big picture. 1. Read the [Architecture Overview](architecture.html) to get the big picture.
1. 阅读[架构概览](architecture.html)以获得宏观视图。
1. Try the [QuickStart](../quickstart.html). The QuickStart is the "Hello, World" of Angular 2. 1. Try the [QuickStart](../quickstart.html). The QuickStart is the "Hello, World" of Angular 2.
It shows us how to setup the libraries and tools we'll need to write *any* Angular app. It shows us how to setup the libraries and tools we'll need to write *any* Angular app.
1. 尝试[QuickStart](../quickstart.html)。QuickStart是Angular 2世界中的“Hello, World”。
它会告诉我们如何安装写 *任何* Angular应用都会用到的那些库和工具。
1. Take the *Tour of Heroes* [Tutorial](../tutorial) which picks up from where the QuickStart leaves off 1. Take the *Tour of Heroes* [Tutorial](../tutorial) which picks up from where the QuickStart leaves off
and builds a simple data-driven app. and builds a simple data-driven app.
Simple, yes, but with the essential characteristics we'd expect of a professional application: Simple, yes, but with the essential characteristics we'd expect of a professional application:
a sensible project structure, data binding, master/detail, services, dependency injection, navigation, and remote data access. a sensible project structure, data binding, master/detail, services, dependency injection, navigation, and remote data access.
Return to the *Basics* section and continue in the suggested order: 1. 学习 *英雄指南* [教程](../tutorial) 它将从QuickStart出发最终构建出一个简单的“数据驱动”的应用。
确实简单,但具备了我们写一个专业应用时所需的一切基本特性:
实用的项目结构、数据绑定、主从视图、服务、依赖注入、导航,以及远程数据访问。
Return to the *Basics* section and continue in the suggested order:
返回 *基础知识* 区,继续按建议的顺序推进:
1. [Displaying Data](displaying-data.html) explains how to get information on to the screen. 1. [Displaying Data](displaying-data.html) explains how to get information on to the screen.
1. [显示数据](displaying-data.html)解释了如何把信息显示到屏幕上。
1. [User Input](user-input.html) covers the basics of responding to user behavior. 1. [User Input](user-input.html) covers the basics of responding to user behavior.
1. [用户输入](user-input.html)覆盖了响应用户行为的基本原理。
1. [Forms](forms.html) handle user data entry and validation within the UI. 1. [Forms](forms.html) handle user data entry and validation within the UI.
1. [表单](forms.html)处理用户输入的数据并且在UI中进行有效性验证。
1. [Dependency Injection](dependency-injection.html) is the way we build large, maintainable applications 1. [Dependency Injection](dependency-injection.html) is the way we build large, maintainable applications
from small, single purpose parts. from small, single purpose parts.
1. [依赖注入](dependency-injection.html)这种方式,让我们能把小型、单一用途的部件组装成大型可维护的应用。
1. [Template Syntax](template-syntax.html) is a comprehensive study of Angular template HTML. 1. [Template Syntax](template-syntax.html) is a comprehensive study of Angular template HTML.
1. [模板语法](template-syntax.html)是对Angular模板HTML的全面研究。
With this foundation, we can read and understand any chapter in the guide. With this foundation, we can read and understand any chapter in the guide.
有了这些基础,我们可以阅读和理解本指南中的任何章节。
// #enddocregion how-to-read-2 // #enddocregion how-to-read-2
// #docregion the-rest // #docregion the-rest
:marked :marked
# Code Samples # Code Samples
# 代码范例
Every chapter includes code snippets that we can reuse in our own applications. Every chapter includes code snippets that we can reuse in our own applications.
These snippets are excerpts from a sample application that accompanies the chapter. These snippets are excerpts from a sample application that accompanies the chapter.
每个章节中都包含一些能在我们自己的应用中复用的代码片段。
这些片段摘抄自本章附带的范例应用。
Look for a link to a running version of that sample near the top of each page Look for a link to a running version of that sample near the top of each page
such as this [live example](/resources/live-examples/architecture/ts/plnkr.html) from the [Architecture](architecture.html) chapter. such as this [live example](/resources/live-examples/architecture/ts/plnkr.html) from the [Architecture](architecture.html) chapter.