translate: guide/appmodule

public/docs/ts/latest/guide/appmodule.jade

@@ -6,133 +6,236 @@ include ../_util-fns
   that you [bootstrap](#main) to launch the application.
   You can call it anything you want. The conventional name is `AppModule`.
 
+  Angular 模块类描述应用的部件是如何组合在一起的。
+  每个应用都至少有一个 Angular 模块，也就是*根*模块，用来[引导](#main)并运行应用。
+  你可以为它取任何名字。常规名字是`AppModule`。
+
   The [setup](setup.html) instructions produce a new project with the following minimal `AppModule`.
   You'll evolve this module as your application grows.
 
+  [搭建本地开发环境](setup.html)讲解了如何使用下面这个最小的`AppModule`来创建一个新项目。
+  这个模块随着应用的成长而演变。
+
 +makeExample('setup/ts/app/app.module.ts','', 'app/app.module.ts')(format='.')
 
 :marked
   After the `import` statements, you come to a class adorned with the
   **`@NgModule`** [_decorator_](glossary.html#decorator '"Decorator" explained').
 
+  `import`声明之后，有个类被 **`@NgModule`**[装饰器](glossary.html#decorator '"Decorator" explained')所装饰。
+
   The `@NgModule` decorator identifies `AppModule` as an Angular module class (also called an `NgModule` class).
   `@NgModule` takes a _metadata_ object that tells Angular how to compile and launch the application.
 
+  该`@NgModule`装饰器将`AppModule`标记为 Angular 模块类（也叫`NgModule`类）。
+  `@NgModule`接受一个*元数据*对象，为 Angular 描述如何编译和启动应用。
+
   * **_imports_** — the `BrowserModule` that this and every application needs to run in a browser.
+
+  * ***imports*** —— `BrowserModule`，这个和每个在浏览器中运行应用都需要它。
+
   * **_declarations_** — the application's lone component, which is also ...
+
+  * ***declarations*** —— 应用的唯一组件，它同时也是...
+
   * **_bootstrap_** — the _root_ component that Angular creates and inserts into the `index.html` host web page.
+
+  * ***bootstrap*** —— *根*组件，Angular 创建它并将其插入到`index.html`宿主页面。
  
   The [Angular Modules (NgModules)](ngmodule.html) guide dives deeply into the details of Angular modules.
-  All you need to know at the moment is a few basics about these three properties.  
+  All you need to know at the moment is a few basics about these three properties.
+
+  [Angular 模块 (NgModules)](ngmodule.html)指南深入讲解了 Angular 模块。
+  现在先初步了解这三个属性。
 
 a#imports
 :marked
   ### The _imports_ array
 
+  ### *imports* 数组
+
   Angular modules are a way to consolidate features that belong together into discrete units.
   Many features of Angular itself are organized as Angular modules. 
   HTTP services are in the `HttpModule`. The router is in the `RouterModule`.
   Eventually you may create a feature module.
 
+  Angular 模块是用来合并那些属于离散单元的特性的。
+  Angular 自身的许多特性也是通过 Angular 模块组织的。
+  HTTP 服务在`HttpModule`里。路由器在`RouterModule`中。
+  最后，你可能也会创建特性模块。
+
   Add a module to the `imports` array when the application requires its features.
 
+  当应用需要模块的特性时，将其添加到`imports`数组中。
+
   _This_ application, like most applications, executes in a browser.
   Every application that executes in a browser needs the `BrowserModule` from `@angular/platform-browser`.
   So every such application includes the `BrowserModule` in its _root_ `AppModule`'s `imports` array.
   Other guide and cookbook pages will tell you when you need to add additional modules to this array.
 
+  *本*应用和大多数其他应用一样，在浏览器中运行。
+  每个浏览器中运行的应用都需要`@angular/platform-browser`里的`BrowserModule`。
+  所以每个这样的应用都在其*根*`AppModule`的`imports`数组中包含了`BrowserModule`。
+  在需要添加额外模块到此数组时，其他指南和烹饪书页面会告诉你。
+
 .alert.is-important
    :marked
      **Only `NgModule` classes** go in the `imports` array. Don't put any other kind of class in `imports`.
 
+     `imports`数组中应该**只有`NgModule`类**。不要放置其他类型的类。
+
 .l-sub-section
   :marked
     Don't confuse the `import` statements at the top of the file with the Angular module's `imports` array.
     They have different jobs.
 
+    不要将 Angular 模块的`imports`数组与文件顶部的`import`声明弄混淆了。它们的功能不同。
+
     The _JavaScript_ `import` statements give you access to symbols _exported_ by other files
     so you can reference them within _this_ file. 
     They have nothing to do with Angular and Angular knows nothing about them.
 
+    *JavaScript* 的`import`声明允许你访问在其他文件中*导出*的符号，这样你可以在*当前*文件引用它们。
+    它们与 Angular 毫无关系，而且 Angular 对它们一无所知。
+
     The _module's_ `imports` array tells Angular about specific Angular modules — classes decorated with `@NgModule` —
     that the application needs to function properly.
+
+    *模块*的`imports`数组为 Angular 提供特定 Angular 模块——被`@NgModule`装饰的类——应用需要它们来正常工作。
 a#declarations
 :marked
   ### The _declarations_ array
+
+  ### *declarations* 数组
   
   You must declare _every_ component in one (and _only one_) `NgModule` class.
   You tell Angular which components belong to the `AppModule` by listing it in the module's `declarations` array.
   As you create more components, you'll add them to `declarations`.
-  
+
+  *每个*组件必须在一个，而且仅仅一个`NgModule`类中声明。
+  通过将其列到`AppModule`模块的`declarations`数组中，你告诉 Angular 哪个组件属于`AppModule`。
+  在创建更多组件的过程中，逐步将它们添加到`declarations`中。
+
   You'll learn to create two other kinds of classes — 
   [directives](attribute-directives.html) and [pipes](pipes.html) —
   that you must also add to the `declarations` array.
 
+  你会学到怎样创建其他两种类——[指令](attribute-directives.html)和[管道](pipes.html)——它们也必须被添加到`declarations`数组。
+
 .alert.is-important
    :marked
       **Only _declarables_** — _components_, _directives_ and _pipes_ — belong in the `declarations` array.  
       Don't put any other kind of class in `declarations`; _not_ `NgModule` classes, _not_ service classes, _not_ model classes.
 
+      **只有*可以声明的***——*组件*、*指令*和*管道*——属于`declarations`数组。不要将其他类型的类添加到`declarations`中，非`NgModule`类, 非服务类，亦非模型类。
+
 a#bootstrap-array
 :marked
   ### The _bootstrap_ array
 
+  ### *bootstrap* 数组
+
   You launch the application by [_bootstrapping_](#main) the root `AppModule`. 
   Among other things, the _bootstrapping_ process creates the component(s) listed in the `bootstrap` array
   and inserts each one into the browser DOM.
 
+  通过[_引导_](#main)根`AppModule`来启动应用。在启动过程中，其中一步是创建列在`bootstrap`数组的组件，并将它们每一个都插入到浏览器的DOM中。
+
   Each bootstrapped component is the base of its own tree of components.
   Inserting a bootstrapped component usually triggers a cascade of component creations that fill out that tree.
 
+  每个引导的组件都是它自己的组件树的根。
+  插入一个被引导的组件通常触发一系列组件的创建并形成组件树。
+
   While you can put more than one component tree on a host web page, that's not typical. 
   Most applications have only one component tree and they bootstrap a single _root_ component.
 
+  虽然你可以将多个组件树插入到宿主页面，但是这并不典型。
+  大多数应用只有一个组件树，它们引导单一*根*组件。
+
   You can call the one _root_ component anything you want but most developers call it `AppComponent`.
 
+  你可以为这个*根*组件取任何名字，但是大多数程序员将其取名为`AppComponent`。
+
   Which brings us to the _bootstrapping_ process itself.
 
+  下面让我们来看看*引导*过程本身。
+
 a#main
 l-main-section
 :marked
   ## Bootstrap in _main.ts_
 
+  ## 在*main.ts*中引导
+
   There are many ways to bootstrap an application.
   The variations depend upon how you want to compile the application and where you want to run it.
+
+  引导应用的方法很多。
+  它们取决于你想如何编译应用以及应用将在哪儿运行。
   
   In the beginning, you will compile the application dynamically with the _Just-in-Time (JiT)_ compiler
   and you'll run it in a browser. You can learn about other options later.
 
+  在开始时，你将使用_即时 (JiT) _编译器动态编译应用。然后在浏览器中运行它。
+  稍后，你可以了解其他选项。
+
   The recommended place to bootstrap a JiT-compiled browser application is in a separate file 
   in the `app` folder named `app/main.ts`
+
+  引导即时编译的浏览器应用的推荐地点是在`app`目录中一个名为`app/main.ts`的单独文件中。
+
 +makeExample('setup/ts/app/main.ts','','app/main.ts')(format='.')
 :marked
   This code creates a browser platform for dynamic (JiT) compilation and
   bootstrap's the `AppModule` described above.
 
+  该代码为动态 (JiT) 编译创建浏览器平台，并引导上面提到的`AppModule`。
+
   The _bootstrapping_ process sets up the execution environment,
   digs the _root_ `AppComponent` out of the module's `bootstrap` array,  
   creates an instance of the component and inserts it within the element tag identified by the component's `selector`.
 
+  引导过程搭建运行环境，从模块的`bootstrap`数组中提出*根*`AppComponent` —— 创建该组件的实例并将其插入到组件`selector`标识的元素标签中。
+
   The `AppComponent` selector — here and in most documentation samples — is `my-app` 
   so Angular looks for a `<my-app>` tag in the `index.html` like this one ...
+
+  `AppComponent`选择器——在这里以及文档大部分例子中——都是`my-app`，所以 Angular 在`index.html`中查找像这样的`<my-app>`标签...
 +makeExample('setup/ts/index.html','my-app')(format='.')
 :marked
   ... and displays the `AppComponent` there.
 
+  ...然后在那儿显示`AppComponent`。
+
   This file is very stable. Once you've set it up, you may never change it again.
 
+  该文件非常稳定。一旦被配置，它可能永远不会再被修改。
+
 a#quickstart-appmodule
 l-main-section
 :marked
   ## QuickStart's _AppModule_
+
+  ## 《快速起步》的`AppModule`
+
   Every Angular application must have a root `NgModule`, even the [QuickStart](../quickstart.html).
   You didn't see it but it was there.
 
+  每个 Angular 应用必须有一个跟`NgModule`，包括[快速起步](../quickstart.html)在内。
+  虽然你看不到它，但是它在那儿。
+
   A script in the `index.html` generated a hidden `AppModule` and bootstrapped it for you
   so you could focus on the `AppComponent` and discover the _essential Angular_ more quickly.
 
+  `index.html`中的一个脚本生成了隐藏的`AppModule`并为你引导它。这样你可以专注于`AppComponent`，以更快的了解* Angular 的基础*。
+
   If you're feeling adventurous, add your own `AppModule` and `main.ts` to the
   live code in the _QuickStart_ plunker.
 
+  你可以添加自己的`AppModule`和`main.ts`到plunker上*快速起步*的在线代码中。
+
   Remove the following `<script>` tag from the `index.html` and see _your_ work in action.
+
+  从`index.html`中删除下面的`<script>`标签，看看*你*的劳动成果。
 +makeExample('quickstart/ts/index.html','autobootstrap','Remove this script tag from "index.html"')(format='.')