Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Angular Client InfiniteScroll requires non-generated Link Http Headers #1459

Open
Evertude opened this issue Mar 10, 2024 · 0 comments
Open

Comments

@Evertude
Copy link

Evertude commented Mar 10, 2024

Overview of the issue

The .NET backend is only creating X-Pagination headers but no Link headers which the Angular Infinite Scroll component is currently requiring for navigation.

Motivation for or Use Case

I want to use Angular with Infinite Scroll and a .NET backend

Reproduce the error

Create any entity with infinite scroll

Related issues
Suggest a Fix

As the React frontend already uses the x-pagination headers I fixed it on the front end, if for consistency its required on the Backend, I'd create the links in Infrastructure.Web.Rest.Utilities.PaginationUtil

here's the angular code of entityFile.component.ts.ejs to fix scrolling:

    protected fillComponentAttributesFromResponseBody(data: I<%= entityAngularName %>[] | null): I<%= entityAngularName %>[] {
<%_ if (paginationInfiniteScroll) { _%>
      // If there is previous link, data is a infinite scroll pagination content.
      if (this.links.hasPrevious) {
        const <%= entityInstancePlural %>New = this.<%= entityInstancePlural %> ?? [];
        if (data) {
          for (const d of data) {
  <%_ if (primaryKey) { _%>
            if (<%= entityInstancePlural %>New.map(op => op.<%= primaryKey.name %>).indexOf(d.<%= primaryKey.name %>) === -1) {
  <%_ } _%>
              <%= entityInstancePlural %>New.push(d);
  <%_ if (primaryKey) { _%>
            }
  <%_ } _%>
          }
        }
        return <%= entityInstancePlural %>New;
      }
<%_ } _%>
      return data ?? [];
    }

<%_ if (!paginationNo) { _%>
    protected fillComponentAttributesFromResponseHeader(headers: HttpHeaders): void {
  <%_ if (paginationPagination) { _%>
      this.totalItems = Number(headers.get(TOTAL_COUNT_RESPONSE_HEADER));
  <%_ } else if (paginationInfiniteScroll) { _%>
      const linkHeader = headers.get('x-pagination');
      if (linkHeader) {
        this.links = JSON.parse(linkHeader);
      } else {
        this.links = {
          last: 0,
        };
      }
    <%_ } _%>
    }
JHipster Version(s)

4.1.0 / 8.1.0

JHipster configuration
Entity configuration(s) entityName.json files generated in the .jhipster directory
Browsers and Operating System

all

  • [ x ] Checking this box is mandatory (this is just to show you read everything)
@Evertude Evertude changed the title Angular Client InfiniteScroll is missing Link Http Headers Angular Client InfiniteScroll requires non-generated Link Http Headers Mar 10, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant