Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Angular serializes brackets for array url parameters #14933

Closed
cidthecoatrack opened this issue Jul 19, 2016 · 5 comments
Closed

Angular serializes brackets for array url parameters #14933

cidthecoatrack opened this issue Jul 19, 2016 · 5 comments

Comments

@cidthecoatrack
Copy link

cidthecoatrack commented Jul 19, 2016

Note: for support questions, please use one of these channels: https://github.com/angular/angular.js/blob/master/CONTRIBUTING.md#question. This repository's issues are reserved for feature requests and bug reports.

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

So the common workaround of appending"[]" to the array-type variable name doesn't work. I am using Angular 1.5.7, and when I give the following parameters:

params: {
    environment: 'Dungeon',
    level: 1,
    'filters[]': ['Dragon', 'Ooze']
};

I get the following url:

http://localhost:49200/Encounter/Validate?environment=Dungeon&filters%5B%5D=Dragon&filters%5B%5D=Ooze&level=1

It is so close to right - but Angular serializes the [], so the url is wrong.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (template: http://plnkr.co/edit/tpl:yBpEi4).

What is the expected behavior?

The url should be built as http://localhost:49200/Encounter/Validate?environment=Dungeon&filters[]=Dragon&filters[]=Ooze&level=1

What is the motivation / use case for changing the behavior?

Both #3740 and #3121 discuss this being a valid way to pass arrays as URL parameters in GET requests for Angular to serialize.

Which versions of Angular, and which browser / OS are affected by this issue? Did this work in previous versions of Angular? Please also test with the latest stable and snapshot (https://code.angularjs.org/snapshot/) versions.

I am using Angular 1.5.7 in Chrome, but seeing it in all browsers

Other information (e.g. stacktraces, related issues, suggestions how to fix)

@gkalpak
Copy link
Member

gkalpak commented Jul 20, 2016

The [/] characters need to be URI-encoded in query strings, so this is working as expected. But the two forms should be equivalent (in the context of query strings). Are you running into problems?

Note that jQuery does the same encoding. Although this probably doesn't work for every backend out there, it is a coomon pattern and should be compatible with most.

The following is also very true ("stolen" from the jQuery docs):

Because there is no universally agreed-upon specification for param strings, it is not possible to encode complex data structures using this method in a manner that works ideally across all languages supporting such input. Use JSON format as an alternative for encoding complex data instead.

@cidthecoatrack
Copy link
Author

Well, I thought I was having an issue, but apparently I have resolved it. So I had found many articles (also in that 2-3 year range) that discussed that an ASP.NET C#/MVC application such as mine would expect the bracket notation to denote arrays as a GET parameter. However, this morning, in preparation for this response, I double-checked and randomly found a StackOverflow article discussing how current ASP.NET MVC expects NO brackets, just duplicate parameter names (http://localhost:49200/Encounter/Validate?environment=Dungeon&filters=Dragon&filters=Ooze&level=1).

So in short, my issue is resolved. The long story, for those Googling to figure out how to use Angular to encode an array, we might want to be clearer that the [] fix is no longer relevant - but maybe it still is for other backends? I'm not sure.

@gkalpak
Copy link
Member

gkalpak commented Jul 20, 2016

Thx for getting back. I think it still is for other backends (and the fact that jQuery does it too is a strong indication that it is a common pattern). In any case, we now support defining your own paramSerializer and serialize parameters exaclty as you want them, so people are free to use their own implementations.

Closing since your issue is resolved.

@gkalpak gkalpak closed this as completed Jul 20, 2016
@doodirock
Copy link

Sorry to necro this issue, but are there any examples out there on how to post to backends that still only accept [] by defining your own paramSerializer? I'm currently working on a project that requires this pattern and was hoping for a bit of guidance.

@gkalpak
Copy link
Member

gkalpak commented Oct 26, 2016

@doodirock, for general support question, please use one of the appropriate support channels.
GitHub issues are reserved for bug reports and feature requests.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

3 participants