Angular 2 rc.6导航到相同的路线不刷新组件

问题描述：

我使用的是angular2 rc.6。我正在开发一种类似于亚马逊搜索的搜索应用程序，用于显示产品。我的问题是，当我路由到不同的参数相同的网址我的组件不会得到更新。但是当我点击页面的任何地方或按任意键我获得更新的数据Angular 2 rc.6导航到相同的路线不刷新组件

我的依赖关系是： -

"dependencies": { 
"@angular/common": "2.0.0-rc.6", 
"@angular/compiler": "2.0.0-rc.6", 
"@angular/core": "2.0.0-rc.6", 
"@angular/forms": "2.0.0-rc.6", 
"@angular/http": "2.0.0-rc.6", 
"@angular/platform-browser": "2.0.0-rc.6", 
"@angular/platform-browser-dynamic": "2.0.0-rc.6", 
"@angular/router": "3.0.0-rc.2", 
"@angular/upgrade": "2.0.0-rc.6", 
"systemjs": "0.19.27", 
"core-js": "^2.4.1", 
"reflect-metadata": "^0.1.3", 
"rxjs": "5.0.0-beta.11", 
"zone.js": "^0.6.17", 
"angular2-in-memory-web-api": "0.0.18", 
"bootstrap": "^3.3.6"

}，

我的路由配置是： -

 const searchRoutes: Routes = [{ path: 'home',component: Dashboard,}, 
{ path: 'titleList/:titleName',component: TitlesListDetails},] 
    export const searchRouting = RouterModule.forRoot(searchRoutes);

路线时使用以下部件

最后TitlesListDetails成分： -

constructor(private searchService : SearchService, 
       private route: ActivatedRoute, 
       private router: Router){ 
    this.route.params.subscribe(params => { this.searchService.fetchAllSearchData(params['titleName'],localStorage.getItem("sortTerm")).subscribe(searchResult => { 
       this.searchResult = searchResult; 
       this.products=searchResult.products;    
      },error => console.log("Error while fetching Products Details") 
     );   
     }); 
    }

我在构造函数中订阅的路由参数。任何机构可以建议如何更新TitlesListDetails

答

当你正在做的组件，重新加载PARAMS在组件的最好方法是使用类似：

this.route.params.subscribe(...)

这里有一个问题，开解释这个选择：https://github.com/angular/angular/issues/9811

它适用于我与Angular 2.2.4和路由器3.2.4，也许你必须更新？

我package.json文件的摘录：

"dependencies": { 
    "@angular/common": "2.2.4", 
    "@angular/compiler": "2.2.4", 
    "@angular/core": "2.2.4", 
    "@angular/forms": "2.2.4", 
    "@angular/http": "2.2.4", 
    "@angular/platform-browser": "2.2.4", 
    "@angular/platform-browser-dynamic": "2.2.4", 
    "@angular/router": "3.2.4", 
    "bootstrap": "3.3.6", 
    "rxjs": "5.0.0-rc.4", 
    "ts-helpers": "^1.1.1", 
    "zone.js": "0.7.1" 
},

感谢答复。我会检查 – Vicky3D

你能分享一下package.json文件吗？ – Vicky3D

我编辑我的答案与提取 –

Angular 2 rc.6导航到相同的路线不刷新组件

相关推荐