Skip to content

Commit 15636d2

Browse files
ParsaArvanehPAParsaArvanehPA
authored
feat(module:empty): support standalone component (#8254)
1 parent e742e39 commit 15636d2

7 files changed

Lines changed: 40 additions & 35 deletions

File tree

‎components/empty/doc/index.en-US.md‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -18,27 +18,27 @@ import { NzEmptyModule } from 'ng-zorro-antd/empty';
1818

1919
## API
2020

21-
### nz-empty
21+
### nz-empty:standalone
2222

23-
| Property | Description | Type | Default |
24-
| -------- | ----------- | ---- | ------- |
25-
| `[nzNotFoundImage]` | Customize image. Will tread as image url when string provided | `string \| TemplateRef<void>` | - |
26-
| `[nzNotFoundContent]` | Custom description | `string \| TemplateRef<void> \| null` | - |
27-
| `[nzNotFoundFooter]` | Custom Footer | `string \| TemplateRef<void>` | - |
23+
| Property | Description | Type | Default |
24+
| --------------------- | ------------------------------------------------------------- | ------------------------------------- | ------- |
25+
| `[nzNotFoundImage]` | Customize image. Will tread as image url when string provided | `string \| TemplateRef<void>` | - |
26+
| `[nzNotFoundContent]` | Custom description | `string \| TemplateRef<void> \| null` | - |
27+
| `[nzNotFoundFooter]` | Custom Footer | `string \| TemplateRef<void>` | - |
2828

2929
### `NZ_CONFIG`
3030

3131
The `nzEmpty` interface has properties as follows:
3232

33-
| Properties | Description | Type |
34-
| ----- | --- | ---- |
33+
| Properties | Description | Type |
34+
| ----------------------- | ------------------------------------------------------------------------------------------------------- | --------------------------------------------------- |
3535
| `nzDefaultEmptyContent` | User default empty component. You can restore the system default empty content by providing `undefined` | `Type<any>\|TemplateRef<string>\|string\|undefined` |
3636

3737
### InjectionToken
3838

39-
| Token | Description | Parameters |
40-
| ----- | --- | ---- |
41-
| `NZ_EMPTY_COMPONENT_NAME` | Would be injected to `NZ_DEFAULT_EMPTY_CONTENT`, telling that component its parent component's name | `string` |
39+
| Token | Description | Parameters |
40+
| ------------------------- | --------------------------------------------------------------------------------------------------- | ---------- |
41+
| `NZ_EMPTY_COMPONENT_NAME` | Would be injected to `NZ_DEFAULT_EMPTY_CONTENT`, telling that component its parent component's name | `string` |
4242

4343
### Global Customizable Empty Content
4444

@@ -53,4 +53,4 @@ You may notice or used some inputs like `nzNotFoundContent` in some components.
5353
}
5454
}
5555
}
56-
```
56+
```

‎components/empty/doc/index.zh-CN.md‎

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -19,29 +19,28 @@ import { NzEmptyModule } from 'ng-zorro-antd/empty';
1919

2020
## API
2121

22-
### nz-empty
22+
### nz-empty:standalone
2323

24-
| 参数 | 说明 | 类型 | 默认值 |
25-
| -------- | ----------- | ---- | ------- |
26-
| `[nzNotFoundImage]` | 设置显示图片，为 `string` 时表示自定义图片地址 | `string \| TemplateRef<void>` | - |
27-
| `[nzNotFoundContent]` | 自定义描述内容 | `string \| TemplateRef<void> \| null` | - |
28-
| `[nzNotFoundFooter]` | 设置自定义 footer | `string \| TemplateRef<void>` | - |
24+
| 参数 | 说明 | 类型 | 默认值 |
25+
| --------------------- | ---------------------------------------------- | ------------------------------------- | ------ |
26+
| `[nzNotFoundImage]` | 设置显示图片，为 `string` 时表示自定义图片地址 | `string \| TemplateRef<void>` | - |
27+
| `[nzNotFoundContent]` | 自定义描述内容 | `string \| TemplateRef<void> \| null` | - |
28+
| `[nzNotFoundFooter]` | 设置自定义 footer | `string \| TemplateRef<void>` | - |
2929

3030
### `NZ_CONFIG`
3131

3232
`nzEmpty` 接口有如下字段：
3333

34-
| 参数 | 说明 | 类型 |
35-
| ----- | --- | ---- |
34+
| 参数 | 说明 | 类型 |
35+
| ----------------------- | ------------------------------------------------------------------- | --------------------------------------------------- |
3636
| `nzDefaultEmptyContent` | 用户自定义的全局空组件，可通过 `undefined` 来取消自定义的全局空组件 | `Type<any>\|TemplateRef<string>\|string\|undefined` |
3737

3838
### InjectionToken
3939

40-
| Token | 说明 | 参数 |
41-
| ----- | --- | ---- |
40+
| Token | 说明 | 参数 |
41+
| ------------------------- | ---------------------------------------------------------------- | -------- |
4242
| `NZ_EMPTY_COMPONENT_NAME` | 将会被注入到用户的全局自定义空组件中，告诉该组件其所在组件的名称 | `string` |
4343

4444
### 全局自定义空组件
4545

4646
你或许知道或者用过一些类似 `nzNotFoundContent` 的属性来自定义组件数据为空时的内容，现在它们都会使用 `Empty` 组件。你可以通过在 `NZ_CONFIG` 中提供 `{ empty: { nzDefaultEmptyContent: something } }` 来定义一个自定义的全局空组件。
47-

‎components/empty/embed-empty.component.ts‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
44
*/
55

6-
import { ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';
6+
import { ComponentPortal, Portal, PortalModule, TemplatePortal } from '@angular/cdk/portal';
7+
import { NgIf, NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common';
78
import {
89
ChangeDetectionStrategy,
910
ChangeDetectorRef,
@@ -26,6 +27,7 @@ import { NzConfigService } from 'ng-zorro-antd/core/config';
2627
import { NzSafeAny } from 'ng-zorro-antd/core/types';
2728

2829
import { NzEmptyCustomContent, NzEmptySize, NZ_EMPTY_COMPONENT_NAME } from './config';
30+
import { NzEmptyComponent } from './empty.component';
2931

3032
function getEmptySize(componentName: string): NzEmptySize {
3133
switch (componentName) {
@@ -61,7 +63,9 @@ type NzEmptyContentType = 'component' | 'template' | 'string';
6163
{{ content }}
6264
</ng-container>
6365
</ng-container>
64-
`
66+
`,
67+
imports: [NzEmptyComponent, NgIf, NgSwitch, NgSwitchCase, NgSwitchDefault, PortalModule],
68+
standalone: true
6569
})
6670
export class NzEmbedEmptyComponent implements OnChanges, OnInit, OnDestroy {
6771
@Input() nzComponentName?: string;

‎components/empty/empty.component.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
44
*/
55

6+
import { NgIf } from '@angular/common';
67
import {
78
ChangeDetectionStrategy,
89
ChangeDetectorRef,
@@ -18,8 +19,12 @@ import {
1819
import { Subject } from 'rxjs';
1920
import { takeUntil } from 'rxjs/operators';
2021

22+
import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
2123
import { NzEmptyI18nInterface, NzI18nService } from 'ng-zorro-antd/i18n';
2224

25+
import { NzEmptyDefaultComponent } from './partial/default';
26+
import { NzEmptySimpleComponent } from './partial/simple';
27+
2328
const NzEmptyDefaultImages = ['default', 'simple'] as const;
2429
type NzEmptyNotFoundImageType = typeof NzEmptyDefaultImages[number] | null | string | TemplateRef<void>;
2530

@@ -51,7 +56,9 @@ type NzEmptyNotFoundImageType = typeof NzEmptyDefaultImages[number] | null | str
5156
`,
5257
host: {
5358
class: 'ant-empty'
54-
}
59+
},
60+
imports: [NgIf, NzOutletModule, NzEmptyDefaultComponent, NzEmptySimpleComponent],
61+
standalone: true
5562
})
5663
export class NzEmptyComponent implements OnChanges, OnInit, OnDestroy {
5764
@Input() nzNotFoundImage: NzEmptyNotFoundImageType = 'default';

‎components/empty/empty.module.ts‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,15 @@
33
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
44
*/
55

6-
import { BidiModule } from '@angular/cdk/bidi';
7-
import { PortalModule } from '@angular/cdk/portal';
8-
import { CommonModule } from '@angular/common';
96
import { NgModule } from '@angular/core';
107

11-
import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
12-
import { NzI18nModule } from 'ng-zorro-antd/i18n';
13-
148
import { NzEmbedEmptyComponent } from './embed-empty.component';
159
import { NzEmptyComponent } from './empty.component';
1610
import { NzEmptyDefaultComponent } from './partial/default';
1711
import { NzEmptySimpleComponent } from './partial/simple';
1812

1913
@NgModule({
20-
imports: [BidiModule, CommonModule, PortalModule, NzOutletModule, NzI18nModule],
21-
declarations: [NzEmptyComponent, NzEmbedEmptyComponent, NzEmptyDefaultComponent, NzEmptySimpleComponent],
14+
imports: [NzEmptyComponent, NzEmbedEmptyComponent, NzEmptyDefaultComponent, NzEmptySimpleComponent],
2215
exports: [NzEmptyComponent, NzEmbedEmptyComponent]
2316
})
2417
export class NzEmptyModule {}

‎components/empty/partial/default.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/
1010
encapsulation: ViewEncapsulation.None,
1111
selector: 'nz-empty-default',
1212
exportAs: 'nzEmptyDefault',
13+
standalone: true,
1314
template: `
1415
<svg
1516
class="ant-empty-img-default"

‎components/empty/partial/simple.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/
2525
</g>
2626
</g>
2727
</svg>
28-
`
28+
`,
29+
standalone: true
2930
})
3031
export class NzEmptySimpleComponent {}

0 commit comments

Comments
 (0)