Question

http://plnkr.co/edit/UHeuW7QIFhHnHVT8itoj?p=preview

这是google为演示相对导航提供的一个plunkr：

export class CrisisListComponent implements OnActivate {
  crises: Crisis[];
  private currSegment: RouteSegment;
  private selectedId: number;

  constructor(
    private service: CrisisService,
    private router: Router) { }

  isSelected(crisis: Crisis) { return crisis.id === this.selectedId; }

  routerOnActivate(curr: RouteSegment, prev: RouteSegment, currTree: RouteTree) {
    this.currSegment = curr;
    this.selectedId = +currTree.parent(curr).getParam('id');
    this.service.getCrises().then(crises => this.crises = crises);
  }

  onSelect(crisis: Crisis) {
    // Absolute link
    // this.router.navigate([`/crisis-center`, crisis.id]);

    // Relative link
    this.router.navigate([`./${crisis.id}`], this.currSegment);
  }
}

现在，在我的Chrome版本中，单击后退按钮后，浏览器前进按钮将无法正常工作。

重现错误：

点击列表中的一个项目
点击后退按钮
- ＆GT;现在前进按钮被禁用

预期：启用前进按钮并显示所点击项目的详细视图

这是一个错误还是我错过了什么？

Answer 1

这是@angular/router https://github.com/angular/angular/issues/9088

的已知问题

此路由器将再次被替换。新的新路由器正在进行中，但很快就会推出。

Answer 2

这是因为在使用服务器呈现的内容时，此导航将从服务器重新请求内容，或者可以重新显示缓存的内容。使用客户端框架，必须模拟此导航，因为导航实际上并未发生，并且状态历史记录已存储并传递到应用程序而不是相同的效果。

来源：http://www.captaincodeman.com/2016/04/02/angular2-new-component-router-review/

angular 2 new router：浏览器的后退和前进按钮无法正常工作

2 个答案: