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

fix(module:config): add itemsize config for tree select table (#8347) #8361

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions components/core/config/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ export interface SelectConfig {
nzBorderless?: boolean;
nzSuffixIcon?: TemplateRef<NzSafeAny> | string | null;
nzBackdrop?: boolean;
nzOptionHeightPx?: number;
}

export interface AffixConfig {
Expand Down Expand Up @@ -295,6 +296,7 @@ export interface TableConfig {
nzShowSizeChanger?: boolean;
nzSimple?: boolean;
nzHideOnSinglePage?: boolean;
nzVirtualItemSize?: number;
}

export interface TabsConfig {
Expand Down Expand Up @@ -329,6 +331,7 @@ export interface TreeConfig {
nzBlockNode?: boolean;
nzShowIcon?: boolean;
nzHideUnMatched?: boolean;
nzVirtualItemSize?: number;
}

export interface TreeSelectConfig {
Expand Down
2 changes: 1 addition & 1 deletion components/select/doc/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ import { NzSelectModule } from 'ng-zorro-antd/select';
| `[nzMaxTagCount]` | Max tag count to show | `number` | - |
| `[nzOptions]` | use nzOptions or `nz-option` to pass options to the select | `Array<{ label: string \| number \| TemplateRef<any>; value: any; key?: string \| number; disabled?: boolean; hide?: boolean; groupLabel?: string \| TemplateRef<any>;}>` | - |
| `[nzMaxTagPlaceholder]` | Placeholder for not showing tags | `TemplateRef<{ $implicit: any[] }>` | - |
| `[nzOptionHeightPx]` | Each option height inside the dropdown | `number` | `32` |
| `[nzOptionHeightPx]` | Each option height inside the dropdown | `number` | `32` |
| `[nzOptionOverflowSize]` | Max option size inside the dropdown, overflow when exceed the size | `number` | `8` |
| `[nzSelectOnTab]` | Allows to select an item with TAB key | `boolean` | `false` |
| `(ngModelChange)` | Current selected nz-option value change callback. | `EventEmitter<any[]>` | - |
Expand Down
2 changes: 1 addition & 1 deletion components/select/doc/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ import { NzSelectModule } from 'ng-zorro-antd/select';
| `[nzMaxTagCount]` | 最多显示多少个 tag | `number` | - |
| `[nzMaxTagPlaceholder]` | 隐藏 tag 时显示的内容 | `TemplateRef<{ $implicit: any[] }>` | - |
| `[nzOptions]` | option 列表,可以取代 nz-option,用法参见例子 | `Array<{ label: string \| number \| TemplateRef<any>; value: any; key?: string \| number; disabled?: boolean; hide?: boolean; groupLabel?: string \| TemplateRef<any>;}>` | - |
| `[nzOptionHeightPx]` | 下拉菜单中每个 Option 的高度 | `number` | `32` |
| `[nzOptionHeightPx]` | 下拉菜单中每个 Option 的高度 | `number` | `32` |
| `[nzOptionOverflowSize]` | 下拉菜单中最多展示的 Option 个数,超出部分滚动 | `number` | `8` |
| `[nzSelectOnTab]` | 允许使用 TAB 键选择项目 | `boolean` | `false` |
| `(ngModelChange)` | 选中的 nz-option 发生变化时,调用此函数 | `EventEmitter<any[]>` | - |
Expand Down
2 changes: 1 addition & 1 deletion components/select/select.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -231,7 +231,7 @@ export class NzSelectComponent implements ControlValueAccessor, OnInit, AfterCon
@Input() nzId: string | null = null;
@Input() nzSize: NzSelectSizeType = 'default';
@Input() nzStatus: NzStatus = '';
@Input() nzOptionHeightPx = 32;
@Input() @WithConfig<number>() nzOptionHeightPx = 32;
@Input() nzOptionOverflowSize = 8;
@Input() nzDropdownClassName: string[] | string | null = null;
@Input() nzDropdownMatchSelectWidth = true;
Expand Down
2 changes: 1 addition & 1 deletion components/table/doc/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ The data passed to `[nzData]` is exported with [Template Context](https://angula
| `[nzHideOnSinglePage]` | Whether to hide pagination on single page | `boolean` | `false` |
| `[nzSimple]` | Whether to use simple mode | `boolean` | - | ✅ |
| `[nzTemplateMode]` | Template mode,no need to pass data to `nzData` | `boolean` | `false` |
| `[nzVirtualItemSize]` | The size of the items in the list, same as [cdk itemSize](https://material.angular.io/cdk/scrolling/api) | `number` | `0` |
| `[nzVirtualItemSize]` | The size of the items in the list, same as [cdk itemSize](https://material.angular.io/cdk/scrolling/api) | `number` | `0` |
| `[nzVirtualMaxBufferPx]` | The number of pixels worth of buffer to render for when rendering new items, same as [cdk maxBufferPx](https://material.angular.io/cdk/scrolling/api) | `number` | `200` |
| `[nzVirtualMinBufferPx]` | The minimum amount of buffer rendered beyond the viewport (in pixels),same as [cdk minBufferPx](https://material.angular.io/cdk/scrolling/api) | `number` | `100` |
| `[nzVirtualForTrackBy]` | The TrackByFunction to be used for tracking changes. | `TrackByFunction<T>` | - |
Expand Down
2 changes: 1 addition & 1 deletion components/table/doc/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ Table 组件同时具备了易用性和高度可定制性
| `[nzHideOnSinglePage]` | 只有一页时是否隐藏分页器 | `boolean` | `false` | ✅ |
| `[nzSimple]` | 当添加该属性时,显示为简单分页 | `boolean` | - | ✅ |
| `[nzTemplateMode]` | 模板模式,无需将数据传递给 `nzData` | `boolean` | `false` |
| `[nzVirtualItemSize]` | 虚拟滚动时每一列的高度,与 [cdk itemSize](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `0` |
| `[nzVirtualItemSize]` | 虚拟滚动时每一列的高度,与 [cdk itemSize](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `0` |
| `[nzVirtualMaxBufferPx]` | 缓冲区最大像素高度,与 [cdk maxBufferPx](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `200` |
| `[nzVirtualMinBufferPx]` | 缓冲区最小像素高度,低于该值时将加载新结构,与 [cdk minBufferPx](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `100` |
| `[nzVirtualForTrackBy]` | 虚拟滚动数据 `TrackByFunction` 函数 | `TrackByFunction<T>` | - |
Expand Down
2 changes: 1 addition & 1 deletion components/table/src/table/table.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -170,7 +170,7 @@ export class NzTableComponent<T> implements OnInit, OnDestroy, OnChanges, AfterV
@Input() nzFooter: string | TemplateRef<NzSafeAny> | null = null;
@Input() nzNoResult: string | TemplateRef<NzSafeAny> | undefined = undefined;
@Input() nzPageSizeOptions = [10, 20, 30, 40, 50];
@Input() nzVirtualItemSize = 0;
@Input() @WithConfig() nzVirtualItemSize = 0;
@Input() nzVirtualMaxBufferPx = 200;
@Input() nzVirtualMinBufferPx = 100;
@Input() nzVirtualForTrackBy: TrackByFunction<T> = index => index;
Expand Down
2 changes: 1 addition & 1 deletion components/tree-select/doc/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select';
| `[nzMaxTagPlaceholder]` | Placeholder for not showing tags | TemplateRef<{ $implicit: NzTreeNode[] }> | - |
| `[nzTreeTemplate]` | Custom Nodes | `TemplateRef<{ $implicit: NzTreeNode }>` | - |
| `[nzVirtualHeight]` | The height of virtual scroll | `string` | `-` |
| `[nzVirtualItemSize]` | The size of the items in the list, same as [cdk itemSize](https://material.angular.io/cdk/scrolling/api) | `number` | `28` |
| `[nzVirtualItemSize]` | The size of the items in the list, same as [cdk itemSize](https://material.angular.io/cdk/scrolling/api) | `number` | `28` |
| `[nzVirtualMaxBufferPx]` | The number of pixels worth of buffer to render for when rendering new items, same as [cdk maxBufferPx](https://material.angular.io/cdk/scrolling/api) | `number` | `500` |
| `[nzVirtualMinBufferPx]` | The minimum amount of buffer rendered beyond the viewport (in pixels),same as [cdk minBufferPx](https://material.angular.io/cdk/scrolling/api) | `number` | `28` |
| `[nzBackdrop]` | whether or not the overlay should attach a backdrop | `boolean` | `false` |
Expand Down
2 changes: 1 addition & 1 deletion components/tree-select/doc/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select';
| `[nzMaxTagPlaceholder]` | 隐藏 tag 时显示的内容 | TemplateRef<{ $implicit: NzTreeNode[] }> | - |
| `[nzTreeTemplate]` | 自定义节点 | `TemplateRef<{ $implicit: NzTreeNode }>` | - |
| `[nzVirtualHeight]` | 虚拟滚动的总高度 | `string` | `-` |
| `[nzVirtualItemSize]` | 虚拟滚动时每一列的高度,与 [cdk itemSize](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `28` |
| `[nzVirtualItemSize]` | 虚拟滚动时每一列的高度,与 [cdk itemSize](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `28` |
| `[nzVirtualMaxBufferPx]` | 缓冲区最大像素高度,与 [cdk maxBufferPx](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `500` |
| `[nzVirtualMinBufferPx]` | 缓冲区最小像素高度,低于该值时将加载新结构,与 [cdk minBufferPx](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `28` |
| `[nzBackdrop]` | 浮层是否应带有背景板 | `boolean` | `false` |
Expand Down
2 changes: 1 addition & 1 deletion components/tree-select/tree-select.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -283,7 +283,7 @@ export class NzTreeSelectComponent extends NzTreeBase implements ControlValueAcc
@Input() @InputBoolean() nzMultiple = false;
@Input() @InputBoolean() nzDefaultExpandAll = false;
@Input() @InputBoolean() nzCheckStrictly = false;
@Input() nzVirtualItemSize = 28;
@Input() @WithConfig() nzVirtualItemSize = 28;
@Input() nzVirtualMaxBufferPx = 500;
@Input() nzVirtualMinBufferPx = 28;
@Input() nzVirtualHeight: string | null = null;
Expand Down
Loading