使用路由器时,我无法导航到带有ID参数的路由。
在我的组件中使用此代码
import { Router } from '@angular/router';
...
constructor(private router: Router) { }
...
public create() {
...
this.router.navigate(['/category/edit', id]);
}
导致错误
Error: Cannot match any routes. URL Segment: 'category/edit;id=11'
at ApplyRedirects.noMatchError (router.js:1719)
at CatchSubscriber.eval [as selector] (router.js:1684)
at CatchSubscriber.error (catchError.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at LastSubscriber.Subscriber._error (Subscriber.js:131)
at ApplyRedirects.noMatchError (router.js:1719)
at CatchSubscriber.eval [as selector] (router.js:1684)
at CatchSubscriber.error (catchError.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at LastSubscriber.Subscriber._error (Subscriber.js:131)
at resolvePromise (zone.js:809)
at resolvePromise (zone.js:775)
at eval (zone.js:858)
at ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:4724)
at ZoneDelegate.invokeTask (zone.js:420)
at Zone.runTask (zone.js:188)
at drainMicroTaskQueue (zone.js:595)
at ZoneTask.invokeTask [as invoke] (zone.js:500)
at invokeTask (zone.js:1517)
如果在模板中使用它,它可以正常工作
<tbody>
<tr *ngFor="let category of model">
<td>{{category.name}}</td>
<td>{{category.code}}</td>
<td>
<button type="button" class="btn btn-outline-primary" [routerLink]="['/category/edit', category.id]">Edit</button>
</td>
</tr>
</tbody>
这是我的路线定义
{
path: 'category/edit/:id',
component: EditComponent,
resolve: {
model: CategoryResolver
}
}
尝试使用和不使用解析器,但无论如何都无法正常工作。
我正在使用 Angular 5.2.0 和 CLI 1.6.5
答案 0 :(得分:1)
this.router.navigate(['/category/edit', id]);
的结果是category/edit;id=11
。当您传入对象而不是字符串时,将使用查询参数(如;id=11
)。我想你的变量id
是object类型而不是string。
id: Object = {id: '11'};
应改为
id: string = '11';