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)
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:
JHipster Version(s)
4.1.0 / 8.1.0
JHipster configuration
Entity configuration(s)
entityName.json
files generated in the.jhipster
directoryBrowsers and Operating System
all