【发布时间】:2016-05-29 00:00:48
【问题描述】:
我正在尝试将 beta 路由器更改为新的组件路由器,
我的项目从官方的 angular2 种子开始:https://github.com/angular/angular2-seed
这就是我的 seed-app.ts 的样子:
import {Component} from '@angular/core';
import {Router, Routes, ROUTER_DIRECTIVES} from '@angular/router';
import {Home} from './components/home/home';
import {About} from './components/about/about';
import {RepoBrowser} from './components/repo-browser/repo-browser';
@Component({
selector: 'seed-app',
providers: [],
pipes: [],
directives: [ROUTER_DIRECTIVES],
styles: [require('./seed-app.scss')],
template: require('./seed-app.html'),
})
@Routes([
{ path: '/home', component: Home},
{ path: '/about', component: About},
{ path: '/github/...', component: RepoBrowser},
])
export class SeedApp {
constructor() {}
}
这是种子应用程序的模板:
<div class="seed-app">
<h3>
Angular 2 Seed
</h3>
<nav>
<a [routerLink]=" ['/home'] ">
Home
</a>
|
<a [routerLink]=" ['/about'] ">
About
</a>
|
<a [routerLink]=" ['/github/repo-list', {org: 'angular'}] ">
Github Repos
</a>
</nav>
<main>
<router-outlet></router-outlet>
</main>
<footer>
© 2016
</footer>
</div>
除了我根本无法到达 github 路线之外,所有路线都在工作,出现此错误:
异常:错误:未捕获(承诺中):无法匹配任何路由。 当前段:'github'。可用路线:['/home', '/about', '/github/...'].
如果有帮助,这是 repo-browser.ts 的代码
import {Component} from '@angular/core';
import {Router, Routes, ROUTER_DIRECTIVES} from '@angular/router';
import {RepoList} from '../repo-list/repo-list';
import {RepoDetail} from '../repo-detail/repo-detail';
import {Github} from '../../services/github';
@Component({
selector: 'repo-browser',
template: require('./repo-browser.html'),
styles: [require('./repo-browser.scss')],
providers: [ Github ],
directives: [ ROUTER_DIRECTIVES ],
pipes: []
})
@Routes([
{path: '/:org', component: RepoList},
{path: '/:org/:name', component: RepoDetail },
])
export class RepoBrowser {
constructor(private router: Router, private github: Github) {}
searchForOrg(orgName: string) {
this.github.getOrg(orgName)
.subscribe(({name}) => {
console.log(name);
this.router.navigate(['RepoList', {org: orgName}]);
});
}
}
【问题讨论】: