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

feat(abc:st): add delay property to support delayed rendering #1854

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 3 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
1 change: 1 addition & 0 deletions packages/abc/st/index.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ When an exception is thrown when parsing column data, *INVALID DATA* will be for
| `[loading]` | Loading status of table, when specifying `null` is controlled by st | `boolean | null` | `null` | - |
| `[loadingIndicator]` | The spinning indicator | `TemplateRef<void>` | - | ✅ |
| `[loadingDelay]` | Specifies a delay in milliseconds for loading state (prevent flush) | `number` | `0` | ✅ |
| [delay] | Whether to delay table rendering, requires manual call to refreshColumns() to render | boolean | false | - |
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

保持使用 [delay] 来包裹代码。

Suggested change
| [delay] | Whether to delay table rendering, requires manual call to refreshColumns() to render | boolean | false | - |
- | [delay] | Whether to delay table rendering, requires manual call to refreshColumns() to render | boolean | false | - |
+ | `[delay]` | Whether to delay table rendering, requires manual call to refreshColumns() to render | boolean | false | - |

| `[scroll]` | Whether table can be scrolled in x/y direction, x or y can be a string that indicates the width and height of table body | `{ y?: string; x?: string }` | - | - |
| `[virtualScroll]` | Enable virtual scroll mode,work with `[nzScroll]` | `boolean` | `false` | ✅ |
| `[virtualItemSize]` | The size of the items in the list, same as [cdk itemSize](https://material.angular.io/cdk/scrolling/api) | `number` | `54` | ✅ |
Expand Down
1 change: 1 addition & 0 deletions packages/abc/st/index.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ module: import { STModule } from '@delon/abc/st';
| `[loading]` | 页面是否加载中,当指定 `null` 由 st 受控 | `boolean | null` | `null` | - |
| `[loadingIndicator]` | 加载指示符 | `TemplateRef<void>` | - | ✅ |
| `[loadingDelay]` | 延迟显示加载效果的时间(防止闪烁) | `number` | `0` | ✅ |
| `[delay]` | 是否延迟渲染表格,需手动调用`refreshColumns()`渲染 | `boolean` | `false` | - |
| `[scroll]` | 横向或纵向支持滚动,也可用于指定滚动区域的宽高度:`{ x: "300px", y: "300px" }` | `{ y?: string; x?: string }` | - | - |
| `[virtualScroll]` | 是否启用虚拟滚动模式,与 `[nzScroll]` 配合使用 | `boolean` | `false` | ✅ |
| `[virtualItemSize]` | 虚拟滚动时每一列的高度,与 [cdk itemSize](https://material.angular.io/cdk/scrolling/api) 相同 | `number` | `54` | ✅ |
Expand Down
3 changes: 2 additions & 1 deletion packages/abc/st/st.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -158,6 +158,7 @@ export class STComponent implements AfterViewInit, OnChanges {
this.updateTotalTpl();
}
@Input() data?: string | STData[] | Observable<STData[]>;
@Input() delay?: boolean = false;
@Input() columns?: STColumn[] | null;
@Input() contextmenu?: STContextmenuFn | null;
@Input({ transform: (v: unknown) => numberAttribute(v, 10) }) ps = 10;
Expand Down Expand Up @@ -894,7 +895,7 @@ export class STComponent implements AfterViewInit, OnChanges {
}

ngAfterViewInit(): void {
this.refreshColumns();
if (!this.delay) this.refreshColumns();
if (!this.req.lazyLoad) this.loadPageData().subscribe();
this.inied = true;
}
Expand Down