Angular 2错误：'/ detail /：id'与现有路由冲突'/ detail /：id'

因此，我一直在构建一个应用程序来了解Angular 2并在终端中遇到此问题：Angular 2错误：'/ detail /：id'与现有路由冲突'/ detail /：id'

app/teacher-detail.component.ts(17,3): error TS2369: A parameter property is only allowed in a constructor implementation. 
    [0] app/teacher-detail.component.ts(18,3): error TS2369: A parameter property is only allowed in a constructor implementation. 
    [0] app/teacher-detail.component.ts(23,19): error TS2339: Property '_routeParams' does not exist on type 'TeacherDetailComponent'. 
    [0] app/teacher-detail.component.ts(24,8): error TS2339: Property '_teacherService' does not exist on type 'TeacherDetailComponent'.

现在，我似乎无法找到问题。我的其他列表（student-detail.component.ts）格式与此列表几乎完全相同，但没有错误弹出。

import {Component, Input, OnInit} from 'angular2/core'; 
import { RouteParams } from 'angular2/router'; 

import {Teacher} from './teacher'; 
import { TeacherService } from './teacher.service'; 

@Component({ 
    selector: 'my-teacher-detail', 
    templateUrl:'app/teacher-detail.component.html', 
}) 

export class TeacherDetailComponent implements OnInit { 
@Input() teacher: Teacher; 


contructor(
    private _teacherService: TeacherService, 
    private _routeParams: RouteParams) { 

    } 

ngOnInit() { 
    let id = +this._routeParams.get('id'); 
    this._teacherService.getTeacher(id) 
     .then(teacher => this.teacher = teacher); 
} 
goBack() { 
window.history.back(); 
}

}

展望Chrome浏览器开发工具，我看到：

EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error during instantiation of Router! (RouterLink -> Router). 
ORIGINAL EXCEPTION: Configuration '/detail/:id' conflicts with existing route '/detail/:id' 
ORIGINAL STACKTRACE: 
Error: Configuration '/detail/:id' conflicts with existing route '/detail/:id'

这让我觉得，这是在我的@RouteConfig app文件？

@RouteConfig([ 
{ 
    path: '/dashboard', 
    name: 'Dashboard', 
    component: DashboardComponent, 
    useAsDefault: true 
}, 
{ 
    path: '/detail/:id', 
    name: 'TeacherDetail', 
    component: TeacherDetailComponent 
}, 
{ 
    path: '/detail/:id', 
    name: 'StudentDetail', 
    component: StudentDetailComponent 
}, 
{ 
    path: '/teachers', 
    name: 'Teachers', 
    component: TeachersComponent 

}, 
{ 
    path: '/students', 
    name: 'Students', 
    component: StudentsComponent 
}, 
])

我完全卡住了，无法弄清楚问题是什么。我怀疑它与/ detail/id有关，但不知道如何继续，因为删除其中的一个并不能解决整体问题。

感谢您的帮助提前！

来源

2016-05-01 Nathan

那么，你必须至少删除一个映射：你不能有两个不同的路线具有完全相同的URL。当你这样做时会发生什么？ –

好的，所以我删除了带有StudentDetail名称的/ detail/id。我现在可以从仪表板导航到老师，但很明显，导航到学生链接不会回来。如果我删除教师版本，单击学生链接仍然没有返回任何东西（可能是一个不同的错误，稍后会检查）但是，我仍然遇到同样的错误，显示在终端中。 – Nathan

错字：'构造函数'应该是'构造函数'。投票结束为错字 –

好的，感谢JB Nizet帮助我。

今天我学到了我不能在路由器中有两条路径相同的路径。我将不得不找出一种不同的方式来路由这个应用程序的特定部分。

另外...他发现一个错字（构造函数而不是构造函数）。

是的，额头碰到了桌子。几次。昨晚盯着三小时的代码，我从来没有抓到它。

感谢您的帮助JB Nizet。

来源

2016-05-01 08:53:16 Nathan

Angular 2错误：'/ detail /：id'与现有路由冲突'/ detail /：id'

回答

相关问题