title: rc1 router "No provider for Router"
body: <p>This is a follow up post for an error that come after @Shuhei helped me resolved the config.js problem <a href="https://stackoverflow.com/questions/37083611/angular-2-rc-router-angular2-polyfills-js349-error">angular 2 rc router angular2-polyfills.js:349 Error</a></p>
  
  <p>This is my app.component.ts</p>
  
  <pre><code>import { Component,provide }       from '@angular/core';
  import { RouteConfig, ROUTER_DIRECTIVES,Router } from '@angular/router-deprecated';
  
  import { HeroShellComponent } from '../apps/hero/hero-shell.component';
  import {HomeComponent} from '../home/home.component';
  
  import {Login} from '../login/auth.component';
  import {Authentication} from '../login/auth.service';
  import {isLoggedin}  from '../login/auth.isLoggedin';
  
  @Component({
    selector: 'my-app', 
    templateUrl: 'app/appshell/app.component.html',
    styleUrls: ['app/appshell/app.component.css'],
    directives: [ROUTER_DIRECTIVES],
  })
  
  @RouteConfig([
      {
          path: '/app/apps/hero/...',
          name: 'Hero Sample',
          component: HeroShellComponent,
      },
      { path: '/app/apps/testapp1', name: 'Testapp1', component: HomeComponent },
      { path: '/', redirectTo: ['Login'] },
      { path: '/home', name: 'Home', component: HomeComponent },
      { path: '/login', name: 'Login', component: Login, useAsDefault: true },   
  ])
  export class AppComponent {
  
    title = 'Apps';
  
    constructor(public _auth: Authentication, 
                public router: Router
                ) {}  
  
    onLogout() {
  
      this._auth.logout();
      this.router.navigate(['/Login']);
    }
  
  }
  </code></pre>
  
  <p>All other components injects Router through constructor like this above. <strong>Router is certainly provided</strong>.</p>
  
  <pre><code>path: '/app/apps/hero/...'
  </code></pre>
  
  <p>is for the child router redirect.</p>
  
  <p>The error I got is </p>
  
  <pre><code>browser_adapter.ts:78 EXCEPTION: Error: 
  Uncaught (in promise): EXCEPTION: Error in :0:0 
  ORIGINAL EXCEPTION: No provider for Router!. 
  
  ORIGINAL STACKTRACE: Error: DI Exception 
  at NoProviderError.BaseException [as constructor] (npmcdn.com/@angular/core@2.0.0-rc.1/src/facade/…) 
  at NoProviderError.AbstractProviderError [as constructor]
  </code></pre>
  
  <p>If the same code worked in beta, what could make it not working in RC1 router-deprecated?</p>
  
  <p>Update: index.html</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;base href="/"&gt;
  
      &lt;title&gt;My Tests&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;    
      &lt;link rel="stylesheet" href="/app/public/css/styles.css"&gt;
  
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-sham.min.js"&gt;&lt;/script&gt;           
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.25/system-polyfills.js"&gt;&lt;/script&gt;      
      &lt;script src="node_modules/systemjs/dist/system.src.js"&gt;&lt;/script&gt;
      &lt;script src="node_modules/rxjs/bundles/Rx.js"&gt;&lt;/script&gt;
  
      &lt;script src="https://code.angularjs.org/2.0.0-beta.17/angular2-polyfills.js"&gt;&lt;/script&gt;
      &lt;script src="https://code.angularjs.org/tools/system.js"&gt;&lt;/script&gt;
      &lt;script src="https://code.angularjs.org/tools/typescript.js"&gt;&lt;/script&gt;
      &lt;script src="/app/systemjs.config.js"&gt;&lt;/script&gt;
  
      &lt;script&gt;
        System.import('app/main').then(null, console.error.bind(console));
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;my-app&gt;Loading...&lt;/my-app&gt;
      &lt;script&gt;document.write('&lt;base href="' + document.location + '" /&gt;');&lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>