title: Angular 2 router no base href set
body: <p>I am getting an error and can't find why. Here is the error:</p>
  
  <pre><code>EXCEPTION: Error during instantiation of LocationStrategy! (RouterOutlet -&gt; Router -&gt; Location -&gt; LocationStrategy).
      angular2.dev.js:23514 EXCEPTION: Error during instantiation of LocationStrategy! (RouterOutlet -&gt; Router -&gt; Location -&gt; LocationStrategy).BrowserDomAdapter.logError @ angular2.dev.js:23514BrowserDomAdapter.logGroup @ angular2.dev.js:23525ExceptionHandler.call @ angular2.dev.js:1145(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
      angular2.dev.js:23514 ORIGINAL EXCEPTION: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.BrowserDomAdapter.logError @ angular2.dev.js:23514ExceptionHandler.call @ angular2.dev.js:1154(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
      angular2.dev.js:23514 ORIGINAL STACKTRACE:BrowserDomAdapter.logError @ angular2.dev.js:23514ExceptionHandler.call @ angular2.dev.js:1157(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
      angular2.dev.js:23514 Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.
          at new BaseException (angular2.dev.js:8080)
          at new PathLocationStrategy (router.dev.js:1203)
          at angular2.dev.js:1380
          at Injector._instantiate (angular2.dev.js:11923)
          at Injector._instantiateProvider (angular2.dev.js:11859)
          at Injector._new (angular2.dev.js:11849)
          at InjectorDynamicStrategy.getObjByKeyId (angular2.dev.js:11733)
          at Injector._getByKeyDefault (angular2.dev.js:12048)
          at Injector._getByKey (angular2.dev.js:12002)
          at Injector._getByDependency (angular2.dev.js:11990)
  </code></pre>
  
  <p>Does anyone know why the router is throwing this? I am using angular2 beta</p>
  
  <p>here is my code:</p>
  
  
  
  <pre class="lang-ts prettyprint-override"><code>import {Component} from 'angular2/core';
  import { RouteConfig, ROUTER_DIRECTIVES } from 'angular2/router';
  import {LoginComponent} from './pages/login/login.component';
  import {DashboardComponent} from './pages/dashboard/dashboard.component';
  @Component({
      selector: 'app',
      directives:[ROUTER_DIRECTIVES],
      template:`
          &lt;div class="wrapper"&gt;
              &lt;router-outlet&gt;&lt;/router-outlet&gt;
          &lt;/div&gt;`
  })
  @RouteConfig([
      { path: '/',redirectTo: '/dashboard' },
      { path: '/login',name:'login',component: LoginComponent },
      { path: '/dashboard',name:'dashboard',component: DashboardComponent,}
  ])
  export class AppComponent {
  }
  </code></pre>