anchor.diff:    * *When the application requests navigation to the path `/crisis-center`, create or retrieve an instance of
     the `CrisisListComponent`, display its view, and update the browser's address location and history with the URL
     for that path.*
  +
  +  * **当应用程序请求导航到路径`/crisis-center`时，创建或者取回一个`CrisisListComponent`的实例，显示它的视图，并将该路径更新到浏览器地址栏和历史。**
   
   .l-sub-section
   
  
positive.code: :marked
    The `loadChildren` property is used by the `Router` to map to our bundle we want to lazy-load, in this case being the `CrisisCenterModule`.
  
    If we look closer at the `loadChildren` string, we can see that it maps directly to our `crisis-center.module` file where we previously built
    out our `Crisis Center` feature area. After the path to the file we use a `#` to denote where our file path ends and to tell the `Router` the name
    of our `CrisisCenter` NgModule. If we look in our `crisis-center.module` file, we can see it matches name of our exported NgModule class.
  
  +makeExample('router/ts/app/crisis-center/crisis-center.module.ts', 'crisis-center-module-export', 'crisis-center.module.ts (export)')
  
  :marked
    The `loadChildren` property is used by the `Router` to map to our bundle we want to lazy-load, in this case being the `CrisisCenterModule`.
    The router will take our loadChildren string and dynamically load in our `CrisisCenterModule`, add its routes to our configuration *dynamically*
    and then load the requested route. This will only happen when route is **first** requested and the module will be immediately be available
    for subsequent requests.
  
  .l-sub-section
    :marked
      Angular provides a built-in module loader that supports **`SystemJS`** to load modules asynchronously. If we were
      using another bundling tool, such as **Webpack**, we would use the Webpack mechanism for asynchronously loading modules.
  
  :marked
    We've built our feature area, we've updated our route configuration to take advantage of lazy-loading, now we have to do the final step
    to break our `CrisisCenterModule` into a completely separate module. In our `app.module.ts`, we'll remove our `CrisisCenterModule` from the
    `imports` array since we'll be loading it on-demand an we'll remove the imported `CrisisCenterModule`.
  
  +makeExample('router/ts/app/app.module.ts', '', 'app.module.ts (final)')
  
  :marked
    If our initial redirect went to `/heroes` instead of going to `/crisis-center`, the `CrisisCenterModule` would not be loaded until the user
    visited a `Crisis Center` route. We'll update our redirect in our `app.routing.ts` to make this change.
  
  +makeExample('router/ts/app/app.routing.6.ts', 'heroes-redirect', 'app.routing.ts (heroes redirect)')
  
  
negative.code:   with the current instance of our `component`, the current `ActivatedRoute` and `RouterStateSnapshot` in case we needed to access
    some external information. This would be useful if we only wanted to use this guard for this component and needed to ask the component's
    properties in or to confirm whether the router should allow navigation away from it.
  
    另外，我们也可以为`CrisisDetailComponent`创建一个特定的`CanDeactivate`守卫。在需要访问外部信息时，`canDeactivate`方法为提供了组件、`ActivatedRoute`和`RouterStateSnapshot`的当前实例。如果只想为这个组件使用该守卫，并且需要使用该组件属性、或者需要路由器确认是否允许从该组件导航出去时，这个守卫就非常有用。
  +makeExample('router/ts/app/can-deactivate-guard.service.1.ts', '', 'can-deactivate-guard.service.ts (component-specific)')
  
  :marked
  