angular-cn/public/docs/js/latest/api/router/Router-class.jade

p.location-badge.
  exported from <a href='../router'>angular2/router</a>
  defined in <a href="https://github.com/angular/angular/tree/master/modules/angular2/src/router/router.js#L9-L232">angular2/src/router/router.js (line 9)</a>

:markdown
  # Router
  The router is responsible for mapping URLs to components.
  
  You can see the state of the router by inspecting the read-only field `router.navigating`.
  This may be useful for showing a spinner, for instance.
  
  ## Concepts
  Routers and component instances have a 1:1 correspondence.
  
  The router holds reference to a number of "outlets." An outlet is a placeholder that the
  router dynamically fills in depending on the current URL.
  
  When the router navigates from a URL, it must first recognizes it and serialize it into an `Instruction`.
  The router uses the `RouteRegistry` to get an `Instruction`.
  
.l-main-section
  h2 Members
  .l-sub-section
    h3 constructor

    
    pre.prettyprint
      code.
        constructor(registry:RouteRegistry, pipeline:Pipeline, parent:Router, hostComponent:any)
    
    :markdown
      
      




  .l-sub-section
    h3 activate

    
    pre.prettyprint
      code.
        activate(instruction:Instruction)
    
    :markdown

      Recursively activate.
      Calls the "activate" hook on descendant components.
      
      





  .l-sub-section
    h3 childRouter

    
    pre.prettyprint
      code.
        childRouter(hostComponent:any)
    
    :markdown

      Constructs a child router. You probably don't need to use this unless you're writing a reusable component.
      
      





  .l-sub-section
    h3 commit

    
    pre.prettyprint
      code.
        commit(instruction:Instruction)
    
    :markdown

      
      
      





  .l-sub-section
    h3 config

    
    pre.prettyprint
      code.
        config(config:any)
    
    :markdown

      Dynamically update the routing configuration and trigger a navigation.
      
      # Usage
      
      ```
      router.config({ 'path': '/', 'component': IndexCmp});
      ```
      
      Or:
      
      ```
      router.config([
        { 'path': '/', 'component': IndexComp },
        { 'path': '/user/:id', 'component': UserComp },
      ]);
      ```
      
      





  .l-sub-section
    h3 deactivate

    
    pre.prettyprint
      code.
        deactivate()
    
    :markdown

      Recursively remove all components contained by this router's outlets.
      Calls deactivate hooks on all descendant components
      
      





  .l-sub-section
    h3 generate

    
    pre.prettyprint
      code.
        generate(name:string, params:StringMap&lt;string, string&gt;)
    
    :markdown

      Generate a URL from a component name and optional map of parameters. The URL is relative to the app's base href.
      
      





  .l-sub-section
    h3 hostComponent

    
    :markdown

      
      





  .l-sub-section
    h3 lastNavigationAttempt

    
    :markdown

      
      





  .l-sub-section
    h3 navigate

    
    pre.prettyprint
      code.
        navigate(url:string)
    
    :markdown

      Navigate to a URL. Returns a promise that resolves to the canonical URL for the route.
      
      If the given URL begins with a `/`, router will navigate absolutely.
      If the given URL does not begin with `/`, the router will navigate relative to this component.
      
      





  .l-sub-section
    h3 navigating

    
    :markdown

      
      





  .l-sub-section
    h3 parent

    
    :markdown

      
      





  .l-sub-section
    h3 previousUrl

    
    :markdown

      
      





  .l-sub-section
    h3 recognize

    
    pre.prettyprint
      code.
        recognize(url:string)
    
    :markdown

      Given a URL, returns an instruction representing the component graph
      
      





  .l-sub-section
    h3 registerOutlet

    
    pre.prettyprint
      code.
        registerOutlet(outlet:RouterOutlet, name: string = &#39;default&#39;)
    
    :markdown

      Register an object to notify of route changes. You probably don't need to use this unless you're writing a reusable component.
      
      





  .l-sub-section
    h3 renavigate

    
    pre.prettyprint
      code.
        renavigate()
    
    :markdown

      Navigates to either the last URL successfully navigated to, or the last URL requested if the router has yet to successfully navigate.
      
      





  .l-sub-section
    h3 subscribe

    
    pre.prettyprint
      code.
        subscribe(onNext)
    
    :markdown

      Subscribe to URL updates from the router