angular 2路由网址问题

时间:2017-03-30 14:28:57

标签: angular redirect routing url-parameters

这是我的app.module.ts文件。

 imports: [
        UniversalModule, // Must be first import. This automatically imports BrowserModule, HttpModule, and JsonpModule too.
        RouterModule.forRoot([
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: 'subscriber', component: SubscriberComponent },
            { path: '**', redirectTo: 'home' }
        ]),
        //HttpModule
        FormsModule
    ]

在我的订阅者组件中我从ngOnInit

中的url获取参数
ngOnInit() {

    let id = '';
    this.activatedRoute.params.subscribe((params: Params) => {
        id = params['id'];
        if (id != '') {
            this.viewData(id);
        }
        console.log(id);
    });
} 

工作正常,但每次我使用网址获取参数(xxx),例如http://localhost:60009/xxx 我收到一个错误,因为路由重定向到这个网址显然我没有任何链接。知道如何跳过路由重定向吗?

1 个答案:

答案 0 :(得分:0)

如果您正在使用路由参数,则需要在路由配置中指定它们。您正在尝试读取参数id,但未在配置中的路由中指定id。尝试将其添加到您的配置中:

{ path: ':id', redirectTo: 'home', pathMatch: 'full' },

修改

Angular同时具有路由器参数和查询参数。 Route params在路由配置中指定,如下所示:

{ path: ':id', redirectTo: 'home', pathMatch: 'full' },

您可以使用以下命令访问组件中的那些:

this.route.params.subscribe(data => data['id']);

然后你也有查询参数。这些未在路由配置中指定。它们在网址中显示如下:?id=something您可以使用以下命令在组件中访问它们:

this.route.queryParams.subscribe(queryParams =>  queryParams['id']);

主要区别在于您是否在激活的路由上使用paramsqueryParams以及是否在路由配置中指定了参数。