angular - 使用 activatedRoute 在 Angular 中访问编码的查询参数

Question

我有 Angular 应用程序，它是在从另一个应用程序重定向后加载的。我想在身份验证网站返回到我的 Angular 应用程序时访问查询参数。网址看起来像

http://localhost:4200/#/starterview?openId%3Dhttps:%2F%2Fmy.fidesque.net%2Fopenid%2Fyobtest_smeuser%26email%3Dyobtest@gml.nl%26userAuthMode%3DSP=

我想访问查询参数，但我无法使用 this.activatedRoute.snapshot.queryParams 正确执行此操作我怀疑这是由于编码参数造成的。有什么解决方法吗？

问候，文奇

Answer 1

您可以使用 decodeURIComponent 解码编码的 URL，正如 Venky 所回答的那样。如果您知道查询参数并想从解码的 URL 中提取值。使用此功能:

getQueryParamFromMalformedURL(name) {
    const results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(decodeURIComponent(this.router.url)); // or window.location.href
    if (!results) {
        return 0;
    }
    return results[1] || 0;
}

如果 url 是 http://localhost:4200/login?username=jerry&code=1234 , 然后

this.getQueryParamFromMalformedURL('username'); // should return 'jerry'