[BUG] [typescript-angular] Incorrect key for query param keys

[jeroen1602]

Bug Report Checklist

• Have you provided a full/minimal spec to reproduce the issue?
• Have you validated the input using an OpenAPI validator (example)?
• Have you tested with the latest master to confirm the issue still exists?
• Have you searched for related issues/PRs?
• What's the actual output vs expected output?
• [Optional] Sponsorship to speed up the bug fix or feature request (example)

Description

If you generate using the option queryParamObjectFormat=key and have object types in your query params then they will not be added correctly. For the input {"a": "first", "b": "second"} this will generate the url /request?a=first&b=second while it should generate /request?params[a]=first&params[b]=second.

The go and angular-fetch generator do seem to add the query parameters using the second method.

openapi-generator version

Tested versions:

• v7.7.0
• master@2107e9ef8f9dd98381d99e03da69a342d092d9c0

OpenAPI declaration file content or url

openapi: 3.0.2
info:
  title: Example
  version: 1.0.0
paths:
  /request:
    description: ""
    get:
      description: ""
      operationId: GetRequest
      parameters:
      - description: Some extra parameters for retrieving the data
        explode: true
        in: query
        name: params
        required: true
        style: deepObject
        schema:
          additionalProperties:
            type: string
          type: object
      responses:
        "200":
          description: 'Ok'
          content:
            text/plain:
              schema:
                type: string

Generation Details

Commands used:

docker run --rm --init -u $UID:"$GID" --mount type=bind,source="${PWD}",destination="/local" openapitools/openapi-generator-cli:v7.7.0 generate -g typescript-angular -i '/local/openapi.yaml' -o /local/generated-angular --additional-properties=nullSafeAdditionalProps=true,supportsES6=true,queryParamObjectFormat=key

docker run --rm --init  -u $UID:"$GID" --mount type=bind,source="${PWD}",destination="/local" openapitools/openapi-generator-cli:v7.7.0 generate -g typescript-fetch -i '/local/openapi.yaml' -o /local/generated-fetch --additional-properties=nullSafeAdditionalProps=true,supportsES6=true

docker run --rm --init -u $UID:"$GID" --mount type=bind,source="${PWD}",destination="/local" openapitools/openapi-generator-cli:v7.7.0 generate -g go -i '/local/openapi.yaml' -o /local/generated-go --additional-properties=prependFormOrBodyParameters=false

Steps to reproduce

1. Generate with command given above with the typescript-angular generator
2. Add the code to an Angular project.
3. Execute DefaultService.getRequest() with some object in the constructor of the app component.
4. See result in network panel of chrome dev tools.

Related issues/PRs

This seems to be almost the same problem with but with json encoding:
#7619

Suggest a fix

The first branch here seems to cause the problem since key is not added as a parameter. But it is probably being omitted for a reason, but I couldn't figure out why.

openapi-generator/modules/openapi-generator/src/main/resources/typescript-angular/api.service.mustache

Lines 108 to 114 in 2107e9e

	{{^isQueryParamObjectFormatJson}}
	if (typeof value === "object" && value instanceof Date === false) {
	httpParams = this.addToHttpParamsRecursive(httpParams, value);
	} else {
	httpParams = this.addToHttpParamsRecursive(httpParams, value, key);
	}
	{{/isQueryParamObjectFormatJson}}

[TheConstructor]

For non-DeepObjects the parameter-name is to be discarded. You can search for {{#isDeepObject}} to see, that other language control the behavior on a per-parameter basis. This likely needs to be done here, too

[gianluca-moro]

I am currently facing a similar issue when using an array in query params:

        - in: query
          name: projection
          schema:
            type: array
            items:
              type: string

Using SwaggerUI generated by backend works correclty, as it appends each array entry separately: http://localhost:8080/rest/v1/test?projection=test1&projection=test2

But when using the TypeScript code generated by the OpenAPI Tools, I get key may not be null if value is not object or array error because it is calling this.addToHttpParamsRecursive(httpParams, value); without the key.

[filiptc]

For non-DeepObjects the parameter-name is to be discarded. You can search for {{#isDeepObject}} to see, that other language control the behavior on a per-parameter basis. This likely needs to be done here, too

@TheConstructor Attempted to implement exactly that in PR #21108. This is my first PR to this project, so hopefully I didn't miss any hoops.