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

Make "noDateVirtualHeight" an input and fix spelling #8446

Open
SaurabhHealum opened this issue Mar 18, 2024 · 4 comments
Open

Make "noDateVirtualHeight" an input and fix spelling #8446

SaurabhHealum opened this issue Mar 18, 2024 · 4 comments
Assignees

Comments

@SaurabhHealum
Copy link

SaurabhHealum commented Mar 18, 2024

Reproduction link

https://stackblitz.com/edit/ng-zorro-antd-ivy-ykibfg?file=src%2Fapp%2Fapp.component.ts

Steps to reproduce

  1. When using nz-table as a virtual table, set the [nzData] to an empty array (replicating no data).
  2. Notice that the nzNoResult template is being shown inside a scrollable container.

What is expected?

  1. noDateVirtualHeight should be an @Input() so we can customize the height based on the no data template we use.
  2. noDateVirtualHeight should be renamed to noDataVirtualHeight.

What is actually happening?

If using a custom [nzNoResult] template, the height is limited by the 182px given by noDateVirtualHeight variable inside table-inner-scroll.component.ts.
This causes the template to not be disaplayed completely, and is instead shown inside a scroll container.

Environment Info
ng-zorro-antd 16.2.2
Browser All
@ParsaArvanehPA
Copy link
Contributor

ParsaArvanehPA commented Mar 20, 2024

Dear @SaurabhHealum,

We appreciate your diligence in identifying and documenting the mentioned issues. A pull request has been initiated to address and resolve both concerns effectively.
PR #8457

@AvaGanesh
Copy link

Facing the same issue as @SaurabhHealum mentioned, not able to find any workaround for it.

Please let us know if there are any quick fixes available.

@SaurabhHealum
Copy link
Author

Hi @ParsaArvanehPA.
Maybe it would also be a better idea to initialise the noDataVirtualHeight to the scrollY value by default (instead of using 182px)?
When we have tables with fixed height, the height remains the same regardless of if there is any data or not. Setting the height to scrollY will ensure this.
Of course, if a user wants to alter this behaviour, the @Input() enables them to change it.

@ParsaArvanehPA
Copy link
Contributor

Facing the same issue as @SaurabhHealum mentioned, not able to find any workaround for it.

Please let us know if there are any quick fixes available.

In the meantime you can manually set the height; like this:

.my-table-class-name {
  nz-table-inner-scroll {
    cdk-virtual-scroll-viewport {
      height: 550px !important;
    }
  }
}

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

No branches or pull requests

4 participants