feat(module:empty): add empty component #2722

wzhudev · 2018-12-31T13:30:58Z

PR Checklist

Please check if your PR fulfills the following requirements:

The commit message follows our guidelines: https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/CONTRIBUTING.md#commit
Tests for the changes have been added (for bug fixes / features)
Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[x] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[x] Documentation content changes
[ ] Application (the showcase website) / infrastructure changes
[ ] Other... Please describe:

What is the current behavior?

Issue Number: #2711

There was no Empty component. And different components handle empty content separately, via inputs like nzNotFountContent or nzNoResult.

What is the new behavior?

All components which need to render an empty placeholder now use NzEmbedEmptyComponent component.
- nzNotFoundContent and other old API would be passed to NzEmbedEmptyComponent.
- there are two ways to set a user default placeholder.
- components affected: cascader, list, select, table, transter.
- tree-select doesn't support this now. The interaction should be changed completely. @hsuanxyz .
Related properties have been removed from i18n files.

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

Due to this bug, users can't invoke NzEmptyService's method to set a default empty component. For that, DI is suggested.
i18n should be unified.

codecov · 2019-01-03T09:13:45Z

Codecov Report

Merging #2722 into master will increase coverage by <.01%.
The diff coverage is 98.13%.

@@            Coverage Diff             @@
##           master    #2722      +/-   ##
==========================================
+ Coverage   95.57%   95.57%   +<.01%     
==========================================
  Files         507      515       +8     
  Lines       12092    12191      +99     
  Branches     1701     1711      +10     
==========================================
+ Hits        11557    11652      +95     
- Misses        171      173       +2     
- Partials      364      366       +2

Impacted Files	Coverage Δ
components/i18n/languages/nl_NL.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/tr_TR.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/nl_BE.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/ja_JP.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/el_GR.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/nb_NO.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/uk_UA.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/et_EE.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/ar_EG.ts	`100% <ø> (ø)`	⬆️
components/i18n/languages/sk_SK.ts	`100% <ø> (ø)`	⬆️
... and 48 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 3f07279...9c6484d. Read the comment docs.

netlify · 2019-01-03T13:51:17Z

Deploy preview for ng-zorro-master ready!

Built with commit 9c6484d

https://deploy-preview-2722--ng-zorro-master.netlify.com

components/select/nz-select.module.ts

hsuanxyz · 2019-01-07T02:43:11Z

components/empty/demo/config.md

+
+## zh-CN
+
+自定义图片、描述、附属内容。自定义全局组件的 Empty 样式。


- 自定义图片、描述、附属内容

hsuanxyz · 2019-01-07T02:48:37Z

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

+| -------- | ----------- | ---- | ------- |
+| `[nzNotFoundImage]` | Customize image. Will tread as image url when string provided | string ｜ TemplateRef | - |
+| `[nzNotFoundContent]` | Custom desciption | string ｜ TemplateRef | - |
+| `[nzNotFoundFooter]` | Custom Footer | string ｜ TemplateRef | - |


#2734

| `string｜TemplateRef<void>`|

hsuanxyz · 2019-01-07T02:53:20Z

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

+
+| Methods/Properties | Description | Parameters |
+| -------- | ----------- | ---- |
+| `setDefaultEmptyContent` | To set the default empty content | `TemplateRef<void>` ｜ `string` ｜ undefined` |


最好不要将 undefined 作为参数，建议在说明里备注 不传则设为默认，或者提供一个重置方法更为合理。

hsuanxyz · 2019-01-07T03:00:11Z

components/empty/nz-empty.component.html

+  <ng-container *nzStringTemplateOutlet="nzNotFoundFooter">
+    {{ nzNotFoundFooter }}
+  </ng-container>
+  <!--<ng-content></ng-content>-->


这段没用可以拿掉

hsuanxyz · 2019-01-07T03:02:49Z

components/empty/nz-empty.component.ts

+  templateUrl    : './nz-empty.component.html',
+  styles         : [ 'nz-empty { display: block; }' ],
+  host           : {
+    '[class.ant-empty]': 'true'


{ - '[class.ant-empty]': 'true' + 'class': 'ant-empty' }

hsuanxyz · 2019-01-07T03:08:04Z

components/list/nz-list.component.ts

@@ -63,6 +59,8 @@ export class NzListComponent implements OnInit, OnChanges, OnDestroy {

  @Input() @InputBoolean() nzSplit = true;

+  @Input() nzNoResult: string | TemplateRef<void>;


新 API 加到文档里面

hsuanxyz · 2019-01-07T03:08:10Z

components/list/nz-list.component.ts

@@ -32,10 +29,9 @@ import { NzListGrid } from './interface';
    }
  ` ]
 })
-export class NzListComponent implements OnInit, OnChanges, OnDestroy {
+export class NzListComponent implements OnInit, OnChanges {
  /* tslint:disable-next-line:no-any */
  locale: any = {};


- locale: any = {};

hsuanxyz · 2019-01-07T03:13:59Z

components/transfer/nz-transfer.component.ts

@@ -155,7 +150,7 @@ export class NzTransferComponent implements OnInit, OnChanges, OnDestroy {

  // #endregion

-  constructor(private cdr: ChangeDetectorRef, private i18n: NzI18nService) {
+  constructor(private cdr: ChangeDetectorRef) {


- locale: any = {};

fix: fix fix: test fix: fix ci Revert: feat(module:empty): add empty component Revert: fix: fix fix: fix ci

wzhudev · 2019-01-07T05:58:37Z

@hsuanxyz Please review again.

hsuanxyz · 2019-01-07T11:16:33Z

components/components.less

@@ -15,6 +15,7 @@
 @import "./divider/style/index.less";
 @import "./drawer/style/index";
 @import "./dropdown/style/index.less";
+@import "./empty/style//index.less";


- @import "./empty/style//index.less"; + @import "./empty/style/index.less";

wzhudev · 2019-01-07T15:56:32Z

@hsuanxyz Updated.

close NG-ZORRO#2711

wzhudev force-pushed the empty branch from df87f3d to c251b64 Compare January 4, 2019 02:08

wzhudev requested a review from vthinkxie January 4, 2019 02:29

wzhudev changed the title ~~[WIP] feat(module:empty): add empty component~~ feat(module:empty): add empty component Jan 4, 2019

wzhudev requested a review from hsuanxyz January 4, 2019 02:30

wzhudev force-pushed the empty branch from c251b64 to c32fc6b Compare January 4, 2019 03:18

hsuanxyz requested changes Jan 4, 2019

View reviewed changes

components/select/nz-select.module.ts Outdated Show resolved Hide resolved

wzhudev force-pushed the empty branch from c32fc6b to 998537b Compare January 7, 2019 02:34

hsuanxyz reviewed Jan 7, 2019

View reviewed changes

feat(module:empty): add empty component

a282a8c

fix: fix fix: test fix: fix ci Revert: feat(module:empty): add empty component Revert: fix: fix fix: fix ci

wzhudev force-pushed the empty branch from ef24966 to a282a8c Compare January 7, 2019 05:45

hsuanxyz requested changes Jan 7, 2019

View reviewed changes

Wendell added 2 commits January 7, 2019 19:39

fix: fix component.less

21ec673

fix: fix demo

9c6484d

hsuanxyz approved these changes Jan 8, 2019

View reviewed changes

hsuanxyz added the PR: ✔️ Merge Ready label Jan 9, 2019

wzhudev merged commit 8906dff into NG-ZORRO:master Jan 9, 2019

wzhudev deleted the empty branch January 11, 2019 02:31

Ricbet pushed a commit to Ricbet/ng-zorro-antd that referenced this pull request Apr 9, 2020

feat(module:empty): add empty component (NG-ZORRO#2722)

42e9e44

close NG-ZORRO#2711

hsuanxyz pushed a commit to hsuanxyz/ng-zorro-antd that referenced this pull request Aug 5, 2020

feat(module:empty): add empty component (NG-ZORRO#2722)

62dea9d

close NG-ZORRO#2711

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(module:empty): add empty component #2722

feat(module:empty): add empty component #2722

wzhudev commented Dec 31, 2018 •

edited

Loading

codecov bot commented Jan 3, 2019 •

edited

Loading

netlify bot commented Jan 3, 2019 •

edited

Loading

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

hsuanxyz Jan 7, 2019

wzhudev commented Jan 7, 2019

hsuanxyz Jan 7, 2019

wzhudev commented Jan 7, 2019 •

edited

Loading


		## zh-CN

		自定义图片、描述、附属内容。自定义全局组件的 Empty 样式。

		@@ -63,6 +59,8 @@ export class NzListComponent implements OnInit, OnChanges, OnDestroy {

		@Input() @InputBoolean() nzSplit = true;

		@Input() nzNoResult: string \| TemplateRef<void>;

feat(module:empty): add empty component #2722

feat(module:empty): add empty component #2722

Conversation

wzhudev commented Dec 31, 2018 • edited Loading

PR Checklist

PR Type

What is the current behavior?

What is the new behavior?

Does this PR introduce a breaking change?

Other information

codecov bot commented Jan 3, 2019 • edited Loading

Codecov Report

netlify bot commented Jan 3, 2019 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

wzhudev commented Jan 7, 2019

Choose a reason for hiding this comment

wzhudev commented Jan 7, 2019 • edited Loading

wzhudev commented Dec 31, 2018 •

edited

Loading

codecov bot commented Jan 3, 2019 •

edited

Loading

netlify bot commented Jan 3, 2019 •

edited

Loading

wzhudev commented Jan 7, 2019 •

edited

Loading