如何从区分大小写的查询参数变量中获取值？

Question

我有一个带有查询字符串 id 的 URL。但是，变量 id 可以作为 'id' 或 'Id' 在 URL.

根据我的理解，这两个将被区别对待。为了处理以下 URL，我编写了如所附屏幕截图中的代码：

http://xxx/abc?id=10

http://xxx/abc?Id=10

enter image description here

除此之外，是否有任何简单的方法来处理区分大小写的变量并在 angular4 中正确取值？

Answer 1

正如@vogomatix 所说，您不应该使用不同名称的相同参数。但是，无论出于何种原因，您都可以像这样简化代码：

private findQueryParams() {
    this._route.queryParams.subscribe((params: Params) => {
        const idValue = params['id'] || params['Id'] || '0';
        let id = Number(idValue);
    });
}

这样您将使用 id 的值，如果不存在，则使用 Id，如果也不存在，则使用 '0'

如果可以有更多组合，如您所说，那么您最好的选择是将参数克隆为小写版本：

function toLower(params: Params): Params {
    const lowerParams: Params = {};
    for (const key in params) {
        lowerParams[key.toLowerCase()] = params[key];
    }

    return lowerParams;
}

有了这个：

private findQueryParams() {
    this._route.queryParams.subscribe((params: Params) => {
        const _params = toLower(params);
        const idValue = params['id'] || '0';
        let id = Number(params);
    });
}

当然，每次从 Router 获取参数时都必须这样做，但这是不可避免的，因为基础缺陷在 Url 系统中。

Answer 2

如果您希望有一个显示特定 abc 项目的组件，那么您真的应该让您的网址没有查询参数并接受路由的概念相反

即而不是 http://xxx/abc?id=10 to show the abc item with an id of 10 you should just be having a route http://xxx/abc/10

然后您可以将此路由添加为：

 { path: 'abc/:id', component: abcComponent },

其中 abcComponent 是显示相关项目的组件

如何从区分大小写的查询参数变量中获取值？

How to take the values from the case sensitive query param variables?

typescript

queryparam

angular