angular: Angular2 Release Candidate Router 2.0.0-rc.1 history navigation broken
- I’m submitting a …
- bug report
- feature request
- support request => Please do not submit support request here, see note at the top of this template.
Current behavior The browser’s forward nav button is permanently disabled and the browser’s back nav button only works for the previous history event losing all history events preceding that one.
Expected/desired behavior Normal push and popstate history navigation via browser’s back/forward nav buttons.
- If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5).
1 Add release candidate router to project or use the quick start project
2 configure routing in main.ts:
import { bootstrap } from "@angular/platform-browser-dynamic";
import { provide } from "@angular/core";
import { LocationStrategy, HashLocationStrategy } from "@angular/common";
import { ROUTER_PROVIDERS } from "@angular/router";
import { AppComponent } from "./app.component";
import { Title } from "@angular/platform-browser";
bootstrap(AppComponent, [
ROUTER_PROVIDERS,
Title,
provide(LocationStrategy, {useClass: HashLocationStrategy})
]);
3 Configure the router:
import {Component} from "@angular/core";
import {Routes, ROUTER_DIRECTIVES} from "@angular/router";
import {ChangeLogComponent} from "./changelog.component";
import {ApiComponent} from "./api.component";
import {HomeComponent} from "./home.component";
import {Title } from "@angular/platform-browser";
@Component({
selector: "my-app",
templateUrl: "app/app.component.html",
styleUrls: ["app/app.component.css"],
directives: [ROUTER_DIRECTIVES]
})
@Routes([
{ path: "/", component: HomeComponent }, // useAsDefault comming soon!
{ path: "/changelog", component: ChangeLogComponent },
{ path: "/api", component: ApiComponent }
])
export class AppComponent {
constructor(private titleService: Title) {}
setTitle(newTitle: string) {
this.titleService.setTitle(newTitle);
}
}
4 Add an anchor tag with routerLink attribute for each route/view in markup similar to the following:
<nav>
<h1>Preamble BDD</h1>
<ul>
<li><a (click)="setTitle('Preamble BDD')" [routerLink]="['/']">Home</a></li>
<li><a (click)="setTitle('Preamble BDD Changelog')" [routerLink]="['/changelog']">Changelog</a></li>
<li><a (click)="setTitle('Preamble BDD API')" [routerLink]= "['/api']">API</a></li>
</ul>
</nav>
<router-outlet></router-outlet>
- What is the expected behavior? Normal push and popstate history navigation via browser’s back/forward nav buttons.
- What is the motivation / use case for changing the behavior? push and popstate handling appears currently broken.
- Please tell us about your environment: Mac OS X 10.9.5 Chrome browser v 50.0.2661.102 (64-bit)
- Angular version: 2.0.0-rc.1
- Browser: Chrome v 50.0.2661.102 (64-bit)
- Language: TypeScript v 1.8.10
About this issue
- Original URL
- State: closed
- Created 8 years ago
- Comments: 22 (2 by maintainers)
How can we be sure? We have heard “This is the one” before. I just need to produce solid software solutions for my clients, I cannot keep chasing various attempts to create a router. Seems like they could have worked with the guys that built UI-Router and came up with something that satisfies the required use cases.
On Sat, Jun 11, 2016 at 6:00 AM, Jeff Schwartz notifications@github.com wrote:
I came here looking for a solution for the broken deprecated router in 2.0.0 RC1. Based on comments above I understand that the router that is to replace the deprecated one, which replaced the Beta router has been scrapped? I just spent the last 4 days upgrading my app to the RC1 so that I can release the first version of my app using at least a release candidate and now I’m learning that I am in worse shape than I was a week ago.
I am trying to use the deprecated router and it’s broken where as the beta 13 was not.
So we have a release candidate that is less stable than the beta 13 version I was on a week ago? I don’t think it was fair to the community to label this a release candidate, I could have stayed on beta 13 and been fine. Now I have to explain to my client that I just wasted a bunch of their money refactoring their code away from something that seems considerably stable.
@CaptainCodeman it’s raining routers lol. OK and thanks for the heads up. Knowing this now really makes me wish this would have been made very obvious somewhere in the current documentation so that I and others might not have even bothered with it in the first place. Yes, the docs do refer to the deprecated router but I and I can assume many others thought they are referring to the one that actually has deprecated as part of its name and which is included in the quick start project. Knowing this now also makes me wonder why the Angular2 development team isn’t just deferring the whole router business to UI-Router2 or whatever they are going to call the ang2 version? Oh, well lol.
That router is no longer being developed and will be deprecated like the one before it. There is a new new new router currently in development.
Yes, it’s appalling that the current router was given the RC1 designation when it was known to be incomplete and that the real state of things wasn’t made more clear. It simply ends up wasting a lot of people’s time, energy and money and I don’t see the point - it isn’t going to endear anyone to the framework, simply leave the impression that it doesn’t work properly and is unreliable.
There are some hints in the weekly meeting notes but the communication has been simply awful. Communication should be more than tweeting PR news, it should be keeping people informed.
I am also experiencing this issue.
Fortunately there was hope for my situation. Just some undocumented reorganization of some code did the trick. This may help with the history issue as well.
@jeffschwartz try this fix for your situation…
https://github.com/angular/angular/issues/9099#issuecomment-224935527
Discussion about somewhat-lack of transparency will go on and on. As others, I lost a lot of time for both routers, throwing them away at the end.
And just few hours ago we were introduced to another deprecation: https://github.com/angular/angular/commit/515a8e07654b745b60a9a12762081dbd0702a4fa And I just feel like DI will be deprecated soon. However, #WeBelieveInYou
@raijinsetsu you could use this one or any other issue opened about the new new router where people were told that a new new new router is on the way. Anyway, I don’t think they will write documentation about anything that’s unfinished. So my answer would be :use ngrx/router or ui-router, and if you want anything related to the official router you’ll just have to wait.