Search code examples
angularurl-routingplunker

Plunkr + Angular2 + Router + Browser Url Change

I'm trying to create a Plunkr using angular2 and the router. I actually have it working here: http://plnkr.co/edit/mU0iS0g68G6vEdAokSNd?p=preview

@Component({
  selector: 'my-app',
  directives: [ROUTER_DIRECTIVES],
  providers: [ROUTER_PROVIDERS]
  template: '<h1>My First Angular 2 App</h1><br/><router-outlet></router-outlet>'
})
@Routes([
{path:'/page-one',component:PageOneComponent },
{path:'/page-two',component:PageTwoComponent }
{path:'*',component:PageOneComponent }
])
export class AppComponent { 
  constructor(public router:Router){

  }
}

My problem is that when I run my app on my machine, the URL will change in the browser when I change routes (e.g. to something like http://localhost/page-one ) but in the plunkr, the url in the browser never changes when I change routes - it just stays as the same plunkr.co/edic/blahblahblah. Is there a way to view/edit/control the 'url' that the app using the router sees within the plunkr?

UPDATE

To give a better idea of what I'm trying to accomplish, im trying to reproduce a bug with the router using plunkr as requested in this issue: https://github.com/angular/angular/issues/8603#issuecomment-218953090

Solution

  • Inside a plunker you must open the plunker in an external window:

    enter image description here

    Then the plunker will open in a window that will show you the URL changes you expect. See below:

    enter image description here