anchor.diff:      We might launch the `AppComponent` in multiple environments with different bootstrappers. 
       Testing the component is much easier if it doesn't also try to run the entire application.
       Let's make the small extra effort to do it *the right way*.
  +    
  +    我们应该用正确的方式组织Angular应用的文件结构。
  +    启动App与展现视图是两个相互分离的关注点。
  +    把这些关注点混在一起会增加不必要的难度。
  +    我们可以通过使用不同的启动器（bootstraper）来在不同的环境中启动`AppComponent`。
  +    测试组件也变得更容易，因为不需要再运行整个程序才能跑测试。
  +    让我们多花一点精力来用*“正确的方式”*实现它。
   
   a(id="index")
   .l-main-section
   :marked
     ## Add the `index.html`
  +  ## 添加`index.html`
     The `index.html` is the web page that hosts the application
     
  +  `index.html`是此应用中的宿主页面。
  +  
     Navigate to the **project root folder**.
     
  +  浏览 **项目根目录**
  +
   code-example(format="").
     cd ..
   :marked
     Create an`index.html` file in this root folder and paste the following lines:
  +  
  +  在根目录下创建`index.html`文件并且粘贴下列代码行：
  +
   +makeExample('quickstart/ts/index.html', null, 'index.html')(format=".")
   .l-verbose-section
     :marked
       There are three noteworthy sections of HTML
  +    
  +    HTML中有三点值得注意
   
       1. The JavaScript [libraries](#libraries)
  +    
  +    1. JavaScript [库](#libraries)
       
       2. Configuration of [SystemJS](#systemjs) where we also import and run the
       `main` file that we just wrote.
       
  +    2. 配置[SystemJS](#systemjs)，以便引入和运行我们刚才写的`main`文件。
  +    
       3. The [&lt;my-app>](#my-app) tag in the `<body>` which is *where our app lives!*
       
  +    3. `<body>`中的[&lt;my-app>](#my-app)标记是*我们的应用“生活”的地方。*
  +
     a(id="libraries")
     :marked
       ### Libraries
  +    ### 库
       We loaded the following scripts
  +    
  +    我们加载下列脚本：
  +
     +makeExample('quickstart/ts/index.html', 'libraries', 'index.html')(format=".")
     :marked
       We began with Internet Explorer polyfills. 
  
positive.code: 
      我们通过给这个组件类加上 **@Component** 前缀，并且传入metadata对象来使用它。
  
    +makeExample('quickstart/ts/app/app.component.ts', 'metadata', 'app/app.component.ts (metadata)')(format=".")
    :marked
      This particular metadata object has two fields, a `selector` and a `template`.
  
  
negative.code:     At the bottom of the file is an empty, do-nothing class named `AppComponent`.
  
      文件的最底下，是一个空的，什么也不做的类，叫做`AppComponent`。
    +makeExample('quickstart/ts/app/app.component.ts', 'export', 'app/app.component.ts (类)')(format=".")
    :marked
      When we're ready to build a substantive application, 
      we can expand this class with properties and application logic. 
  