[英]Email Address in params 404s in Angular 2
I have a few URLs which share a common relationship: http://localhost:3000/account/changeforgottenpassword 我有一些具有共同关系的URL: http:// localhost:3000 / account / changeforgottenpassword
(200OK, PASS) http://localhost:3000/account/changeforgottenpassword/testexample/75c09b18-6090-44df-a18d-d1fe06ab1cde (200OK,通过) http:// localhost:3000 / account / changeforgottenpassword / testexample / 75c09b18-6090-44df-a18d-d1fe06ab1cde
(200OK, PASS) http://localhost:3000/account/changeforgottenpassword/testexample2/75c09b18-6090-44df-a18d-moreblahd1fe06ab1cde (200OK,通过) http:// localhost:3000 / account / changeforgottenpassword / testexample2 / 75c09b18-6090-44df-a18d-moreblahd1fe06ab1cde
(404 - FAIL) http://localhost:3000/account/changeforgottenpassword/blahblah@test.com/75c09b18-6090-44df-a18d-moreblah (404-失败) http:// localhost:3000/account/changeforgottenpassword/blahblah@test.com/75c09b18-6090-44df-a18d-moreblah
In app.module.ts
I have the following routes configured (code shortened for brevity): 在
app.module.ts
我配置了以下路由(为简洁起见,代码缩短了):
import { RouterModule } from '@angular/router';
RouterModule.forRoot([
{ path: 'login', component: LoginComponent },
{ path: 'login/forgotpassword', component: ForgotPasswordComponent },
{ path: 'account/changeforgottenpassword/:type/:id', component: ChangePasswordComponent },
{ path: 'dashboard', component: DashboardComponent },
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: '**', component: PageNotFoundComponent }
])
All of the routes work. 所有路线均有效。 However, the
account/changeforgottenpassword
path will need to be configured so the respective ChangePasswordComponent
only displays for the second URL, third URL, etc. 但是,将需要配置
account/changeforgottenpassword
路径,以便相应的ChangePasswordComponent
仅显示第二个URL,第三个URL等。
I tried to wildcard the path (eg account/changeforgottenpassword/**
) but that did not work. 我试图通配路径(例如
account/changeforgottenpassword/**
),但这没有用。
In the end, all I end up with is a 404 when visiting URLs with email addresses specified in the parameters. 最后,当我访问带有参数中指定的电子邮件地址的URL时,最终得到的只是404。
CODE snippet is here: https://plnkr.co/edit/g2wkInKnWnbRhgqVHkRg?p=catalogue 程式码片段在这里: https : //plnkr.co/edit/g2wkInKnWnbRhgqVHkRg?p = catalogue
Thanks for your time, SO community! 谢谢您的宝贵时间,SO社区!
You need to defined what the wildcard is, for instance: 您需要定义什么是通配符,例如:
{ path: 'account/changeforgottenpassword/:type/:id', component: AnotherComponent }
Then these will be accessible via ActivatedRouteSnapshot
or ActivatedRoute
. 然后可以通过
ActivatedRouteSnapshot
或ActivatedRoute
访问它们。
@Component()
export class AnotherComponent implements OnInit {
private _route: ActivatedRouteSnapshot;
constructor(route: ActivatedRouteSnapshot) {
this._route = route;
}
ngOnInit() {
// http://localhost:3000/account/changeforgottenpassword/blahblahtest/75c09b18-6090-44df-a18d-moreblah
console.log(this._route.params['type']) // blahblahtest
console.log(this._route.params['id']) // 75c09b18-6090-44df-a18d-moreblah
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.