Angular2：如果组件相同，路由器出口不更新页面

Question

我正在开发一个应用程序，我在其中配置了如下路由器插座

{ path: 'dashboard/:id', component: DashboardComponent}

因此，当我点击第一个 link 即 dashboard/1 时，页面会更新。当我单击第二个 link dashboard/2 时，页面 URL 已更新，但视图未更新。但是当我刷新时它正在更新。

我的Dashboardcomponent.html如下

<div    #coloneanchor></div>
    </div>

<div class="col-md-6">
<div   #coltwoanchor></div>
 </div>

我的Dashboardcomponent.ts

@ViewChild('coloneanchor', { read: ViewContainerRef }) coloneanchor: any;
@ViewChild('coltwoanchor', { read: ViewContainerRef }) coltwoanchor: any;

this.route.params.subscribe(param => {
       this.id = param["id"];
        this.userService.getGadgets(this.id).subscribe(gadgets => {

switch(gadget)

case gadget1:
case gadget2:

这里我在我的视图中创建了两个锚点。获得 ID 后，我会将其传递给 API 以获取小工具和数据及其列位置。我循环遍历小工具并将它们添加到锚点。

Answer 1

在 DashboardComponent、

中尝试以下操作

  constructor(private route: ActivatedRoute){}
  ngOnInit(){
    this.route.params.subscribe(param => {
       let id = param["id"];
       /// reload grid and charts...           
    })
  }

希望对您有所帮助！！

Angular2：如果组件相同，路由器出口不更新页面

Angular2: Router outlet not updating page if the component is same

angular2-routing

angular2-router

angular