我有单点登录的地方,但为了测试,我想从url localhost:4200/?id=test&name=testing&email=testing@test.com
读取值,并将它们传递给应用程序组件中的API。
将有一个标志的基础上,我将从url阅读,而不是使用单点登录功能
if (url_enabled == true) {
getParamsFromUrl()
} else {
singleSignOn()
}
我尝试了ActivatedRoute,但似乎不起作用。
我试过queryParams, params, url, queryParamsMap
,但这些似乎都不起作用。我得到的都是空值。
内部应用程序组件
app.component.ts
getParamsFromUrl() {
this._router.events.subscribe((e) => {
if (e instanceof NavigationEnd) {
console.log(e.url)
}
})
}
this.route.queryParams.subscribe(params => {
console.log(params);
})
app.component.html
<router-outlet></router-outlet>
app-routing.module.ts
const routes: Routes = [
{path:'*/:id', component: AppComponent},
];
我已经尝试了我在stackoverflow或其他博客上能找到的任何东西。有人能指出我在这里错过了什么吗?
7条答案
按热度按时间bqujaahr1#
对于此路线:您可以这样尝试:
AppComponent .ts文件中:
6ie5vjzr2#
首先,有一个像你这样的URL,其中包含queryParams:
localhost:4200/?id=test&name=testing&email=testing@test.com
通过这种方式,您可以使用ActivatedRoute对象访问queryparams,如:
或者:
另一种方法是
localhost:4200/test/testing/testing@test.com
用于同步检索(一次):
bvjveswy3#
Angular为我们提供了ActivatedRoute对象。我们可以以与上面相同的方式访问URL参数值,几乎没有区别。这种类型的数据可以通过两种不同的方式访问。一种是通过route.snapshot.paramMap,另一种是通过route.paramMap.subscribe。两者之间的主要区别是订阅将随着特定路由的参数更改而继续更新。
9rygscc14#
您需要创建新组件并更新工艺路线配置,如下所示:
首先,创建一个新组件:
MainComponent
:然后,更新
AppModule
:最后,您需要更新
index.html
文件(确保加载全新的组件,而不是AppComponent
):现在您可以读取
AppComponent
中请求的参数:请参见此处的工作示例:https://read-params-app-component.stackblitz.io/?id=test&name=testing&email=testing@test.com。
并找到源代码here。
我希望它有帮助!
2nc8po8w5#
你可以这样试试
ztigrdn86#
从
@uirouter/core
使用Transition
可以很容易地从url获取参数。lqfhib0f7#
我在angular 8中使用了jquery,并在app组件中声明后使用jquery $变量获得了href。