相关疑难解决方法(0)

我已升级为使用路由器弃用的新Angular 2路由器,并且某些行为已更改.

我遇到问题的页面是搜索页面.我们选择使用HashLocationStrategy.将所有搜索字词放在网址中.路线看起来像这样:

const routes: RouterConfig = [
  { path: '', component: HomeComponent },
  { path: 'search/:term/:cat/:page/:sort/:size/:more', component: HomeComponent },
  { path: 'search/:term/:cat/:page/:sort/:size', component: HomeComponent },
  { path: 'search/:term/:cat/:page/:sort', component: HomeComponent },
  { path: 'search/:term/:cat/:page', component: HomeComponent },
  { path: 'search/:term/:cat', component: HomeComponent },
  { path: 'search/:term', component: HomeComponent },
  { path: 'details/:accountNumber', component: DetailsComponent }
];

我知道查询字符串方法可能更适合所有这些选项,但项目要求由其他人决定......

无论如何,如果我导航到localhost/#/search/Hello使用,this.router.navigate(['/search/Hello']);那么路由器工作正常,一切都很好.在该页面上,如果我尝试this.router.navigate(['/search/World']);然后浏览器地址栏中的URL将相应更新,但组件根本不会更改.

以前我可以routerCanReuse用来表明我确实想重用搜索组件,并routerOnReuse在导航发生时重新运行搜索.我没有看到与这些相同的东西@angular/router.如何使用新的URL参数重新加载当前路由？

我正在运行Angular 2的2.0.0-rc.3版和@ angular/router的3.0.0-alpha.8版.

我最近更新到新的RC3和Router3alpha,似乎有些事情发生了变化.

我注意到单击活动路径的链接不再导致重新加载组件.如何使用新的router3实现此行为？

我的链接看起来像

<a [routerLink]="['/link1']">Link1</a>

为了测试我只是在ngOnInit中使用了一个随机数:

export class LinkoneComponent implements OnInit 
{

    public foo: number;
    constructor() {}

    ngOnInit() 
    {
        this.foo = Math.floor(Math.random() * 100) + 1;
    }

}

在路由之间切换时它可以正常工作,但是单击当前活动的路由不会导致组件的重新加载.

我刚刚开始潜入Angular 1.5来自Angular 1.5.我正在处理用户路由并将API数据从服务中提取到用户组件中.

与1.*中的控制器不同,组件似乎保持静态,在每个请求中刷新它们.

无论如何要在每个新路由请求上调用ngOnInit函数吗？

我的用户组件类:

// url structure: /user/:id
export class UserComponent implements OnInit {

    constructor(private route: ActivatedRoute) {}

    ngOnInit() {

      // doesn't log new id on route change
      let id = this.route.snapshot.params['id'];
      console.log(id);

      this.route.params
        .switchMap(params => this.userService.getUser(params['id']))
        .subscribe(user => {
          // logs new id on route change
          let id = this.route.snapshot.params['id'];
          console.log(id);

          this.user = user
        });
    }
}

更新:

找到了一个我觉得最适合我的方案的解决方案.根据我的问题和进一步调查的几个答案和评论,订阅路线似乎是要走的路.这是我更新的组件:

export class UserComponent {

  user;
  id;

  constructor(
    private userService: UserService,
    private route: ActivatedRoute
  ) {}


  ngOnInit() { …