新的Angular2路由器配置

當使用廢棄的路由器時，我能夠做一個router.config並傳入一個對象。事情是，路由器本身在應用程序啓動後被配置了一點，該對象具有與使用@RouterConfig相同的「模板」。我在尋找的是如果有一種方法來配置這樣的新路由器。一直在查看文檔，但我有點茫然，因爲它尚未記錄。新的Angular2路由器配置

編輯因回答

不，我不能使用@Routes。事情是我在路由器的建設之後加載配置。下面是我如何與舊的路由器做了一個文檔片斷：

 myLoader.loadComponentConfig(configPath) 
     .then(components => { self.Components = components; 
     components.map(comp => { 
      self.RouterComponents.push(
       { 
        path: '/' + comp.name, 
        component: comp, 
        as: comp.name 
       } 
      )}); 
      router.config(self.RouterComponents); 
     });

正如你所看到的，我自己建一個JSON對象（RouterComponents），然後將其發送到路由器。我正在尋找一種與新路由器相同的方法，或者類似的方法。

來源

2016-05-17 user1640736

我也面臨着同樣的障礙。我們已經創建了一個返回路由配置的服務。我能夠使用ngFor編寫從服務接收的數據的routeLink。但是我們不能在@Routes裝飾器中使用服務。通過文檔，我們沒有在路由器中找到任何配置方法。 – Siraj

@Siraj您可以嘗試ngrx路由器或使用已棄用的路由器。 – user1640736

也許等待這個https://github.com/angular/angular/issues/8590 – Siraj

在新的路由器（ >= RC.3）https://angular.io/docs/ts/latest/api/router/index/Router-class.htmlresetConfig可以使用

router.resetConfig([ 
{ path: 'team/:id', component: TeamCmp, children: [ 
    { path: 'simple', component: SimpleCmp }, 
    { path: 'user/:name', component: UserCmp } 
] } 
]);

您可能需要提供一些虛擬路由器配置，以避免在應用程序啓動時發生錯誤。

https://github.com/angular/angular/issues/11437#issuecomment-245995186提供RC.6 Plunker

來源

2016-06-29 09:57:52

-1

事實上，總之你需要使用@Routes而不是@RouterConfig。下面是一個示例：

@Routes([ 
    {path: '/crisis-center', component: CrisisListComponent}, 
    {path: '/heroes',  component: HeroListComponent}, 
    {path: '*',  component: CrisisListComponent} 
]) 
export class AppComponent { }

查看angular.io這個文檔瞭解更多詳情：

https://angular.io/docs/ts/latest/guide/router.html

你可以注意到，它仍然在這個文檔的一些錯字本章自是一項正在進行的工作;-)

來源

2016-05-17 07:55:30

再次檢查問題，我已經添加了一些相關的細節。很抱歉，如果它不夠清楚。 – user1640736

我認爲這樣更好：

在main.ts：

import { ROUTER_PROVIDERS } from 'angular2/router'; 

bootstrap(AppComponent, [ 
    ROUTER_PROVIDERS, 
    provide(LocationStrategy, { useClass: HashLocationStrategy }) 
]);

在你component.ts：

import { Router, RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from 'angular2/router'; 
import { APP_ROUTES } from './route.config'; 

@RouteConfig(APP_ROUTES)

並創造一個文件route.config.ts：

import { Route } from 'angular2/router'; 

import { HomeComponent } from './home/home.component'; 
import { TableComponent } from './table/table.component'; 

export var Routes = { 
    home: new Route({ 
     path: '/home', 
     component: HomeComponent, 
     name: 'Home', 
     useAsDefault: true, 
     data: { 
      title: 'Home' 
     } 
    }), 
    table: new Route({ 
     path: '/table/:table', 
     component: TableComponent, 
     name: 'Table' 
    }) 
}; 

export const APP_ROUTES = Object.keys(Routes).map(r => Routes[r]);

來源

2016-05-17 12:34:00 fireaxe

1。這是不推薦使用的路由器。 2.我有一個jsom文件，隨時更新路由，所以我需要重新配置它。 – user1640736

新的Angular2路由器配置

回答

相關問題