title: Prevent Default Routing - Angular 2
body: <p>How can I <em>prevent default</em> the routing in angular 2? In <strong><em>router subscribe</em></strong>, I get only the path name. I am not getting event in it. Is there any other service provider in angular 2 to get the route change event?</p>
  
  <p><strong>app.component.js</strong></p>
  
  <pre><code>(function (app) {
  
  app.AppComponent = ng.core
          .Component({
              selector: 'my-app',
              templateUrl: 'app/views/main.html',
              directives: [ng.router.ROUTER_DIRECTIVES],
              viewProviders: [ng.http.HTTP_PROVIDERS]
          })
          .Class({
              constructor: [ng.router.Router, ng.http.Http, function (router, http) {
  
                     this.router.subscribe(function (pathname) {
                         //console.log(pathname);
                     });
  
              }],
          });
  
  ng.router
          .RouteConfig([
            { path: '/login', component: app.LoginComponent, name: 'Login', useAsDefault: true },
            { path: '/todos', component: app.TodosComponent, name: 'Todos' },
          ])(app.AppComponent);
  
  })(window.app || (window.app = {}));
  </code></pre>
  
  <p><strong>boot.js</strong></p>
  
  <pre><code>(function (app) {
  
      document.addEventListener('DOMContentLoaded', function () {
          ng.platform.browser.bootstrap(app.AppComponent, [ng.router.ROUTER_PROVIDERS, ng.core.provide(ng.router.LocationStrategy, { useClass: ng.router.HashLocationStrategy })]);
      });
  
  })(window.app || (window.app = {}));
  </code></pre>