From cfd0497267c4215f3c5f5dbe527033380d6f7a28 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8D=A1=E8=89=B2?= Date: Mon, 1 Oct 2018 19:57:21 +0800 Subject: [PATCH] refactor(all): use input instead of ContentChild (#192) --- docs/upgrade-v2.en-US.md | 208 +++++++++++------- docs/upgrade-v2.zh-CN.md | 54 ++++- packages/abc/footer-toolbar/demo/basic.md | 4 +- .../footer-toolbar.component.html | 7 + .../footer-toolbar.component.ts | 22 +- .../abc/footer-toolbar/footer-toolbar.spec.ts | 45 ++-- packages/abc/page-header/demo/image.md | 55 ++--- packages/abc/page-header/demo/simple.md | 2 +- packages/abc/page-header/demo/standard.md | 3 +- packages/abc/page-header/demo/structure.md | 15 +- .../abc/page-header/page-header.component.ts | 12 +- packages/abc/page-header/page-header.spec.ts | 3 +- packages/abc/table/index.en-US.md | 4 +- packages/abc/table/index.zh-CN.md | 4 +- packages/abc/table/table.component.ts | 4 +- 15 files changed, 278 insertions(+), 164 deletions(-) create mode 100644 packages/abc/footer-toolbar/footer-toolbar.component.html diff --git a/docs/upgrade-v2.en-US.md b/docs/upgrade-v2.en-US.md index 8a0a76bec..ac01ade41 100644 --- a/docs/upgrade-v2.en-US.md +++ b/docs/upgrade-v2.en-US.md @@ -67,35 +67,72 @@ Because of the BEM style naming, you need to modify style name of `src/app/layou ### New library -| Old | New | Description | -| ----------------- | ------- | ------- | -| `abc/chart` | `chart` | G2 chart [#diff](https://github.com/ng-alain/ng-alain/pull/673/files#diff-6c960904023c582a766661950a35b283R8) | -| `abc/number-info` | `chart` | - | -| `abc/trend` | `chart` | - | +| Old | New | Description | +|-------------------|---------|-------------| +| `abc/chart` | `chart` | G2 chart [#diff](https://github.com/ng-alain/ng-alain/pull/673/files#diff-6c960904023c582a766661950a35b283R8) | +| `abc/number-info` | `chart` | - | +| `abc/trend` | `chart` | - | ### Component name of abc -| Old | New | ng update | Description | -| ------------------- | -------- | --------- | ---- | -| `simple-table` | `st` | - | - | -| `desc-list` | `sv` | - | - | -| `simple-html-form` | `se` | - | - | -| `standard-form-row` | `se` | - | - | +| Old | New | ng update | Description | +|---------------------|------|-----------|-------------| +| `simple-table` | `st` | - | - | +| `desc-list` | `sv` | - | - | +| `simple-html-form` | `se` | - | - | +| `standard-form-row` | `se` | - | - | + +e.g: + +```diff +- ++ +``` + +### Use input instead of ContentChild + +| Component | Old ContentChild | New Property | ng update | Description | +|------------------|------------------|--------------|-----------|-------------| +| `st` | `body` | `body` | √ | - | +| `st` | `expand` | `expand` | √ | - | +| `footer-toolbar` | `extra` | `extra` | √ | - | +| `page-header` | `breadcrumb` | `breadcrumb` | √ | - | +| `page-header` | `logo` | `logo` | √ | - | +| `page-header` | `action` | `action` | √ | - | +| `page-header` | `content` | `content` | √ | - | +| `page-header` | `extra` | `extra` | √ | - | +| `page-header` | `tab` | `tab` | √ | - | + +e.g: + +```diff +- ++ +- +- +``` ### Component property of abc -| Component | Old | New | ng update | Description | -| ---------------- | ------------ | ---------- | --------- | -------------------------------- | -| `na-page-header` | `home_link` | `homeLink` | - | - | -| `na-page-header` | `home_i18n` | `homeI18n` | - | - | -| `st` | `sortReName` | removed | × | 仅使用 `STColumn.sort.reName` 值 | +| Component | Old | New | ng update | Description | +|---------------|--------------|------------|-----------|--------------------------------------| +| `page-header` | `home_link` | `homeLink` | - | - | +| `page-header` | `home_i18n` | `homeI18n` | - | - | +| `st` | `sortReName` | removed | × | Just only via `STColumn.sort.reName` | + +e.g: + +```diff +- ++ +``` ### Configuration of abc -| Injection Token | 新方式 | ng update | Description | -| ---------------- | ------------ | --------- | ---- | -| `DA_XLSX_CONFIG` | `XlsxConfig` | × | - | -| `DA_ZIP_CONFIG` | `ZipConfig` | × | - | +| Injection Token | New | ng update | Description | +|------------------|--------------|-----------|-------------| +| `DA_XLSX_CONFIG` | `XlsxConfig` | × | - | +| `DA_ZIP_CONFIG` | `ZipConfig` | × | - | ### simple-table @@ -103,34 +140,41 @@ Because of the BEM style naming, you need to modify style name of `src/app/layou #### Attributes -| 原属性名 | 新属性名 | 子参数 | ng update | 兼容处理 | 描述 | -| --------------------- | ---------- | ----------------- | --------- | -------- | ---- | -| `[extraParams]` | `req` | `params` | - | - | - | -| `[reqReName]` | `req` | `reName` | - | - | - | -| `[reqMethod]` | `req` | `method` | - | - | - | -| `[reqHeader]` | `req` | `header` | - | - | - | -| `[reqBody]` | `req` | `body` | - | - | - | -| `[resReName]` | `res` | `reName` | - | - | - | -| `[preDataChange]` | `res` | `process` | - | - | - | -| `[frontPagination]` | `page` | `front` | - | - | - | -| `[zeroIndexedOnPage]` | `page` | `zeroIndexed` | - | - | - | -| `[pagePlacement]` | `page` | `placement` | - | - | - | -| `[showPagination]` | `page` | `show` | - | - | - | -| `[showSizeChanger]` | `page` | `showSize` | - | - | - | -| `[pageSizeOptions]` | `page` | `pageSizes` | - | - | - | -| `[showQuickJumper]` | `page` | `showQuickJumper` | - | - | - | -| `[showTotal]` | `page` | `total` | - | - | - | -| `[isPageIndexReset]` | `page` | `indexReset` | - | - | - | -| `[toTopInChange]` | `page` | `toTop` | - | - | - | -| `[toTopOffset]` | `page` | `toTopOffset` | - | - | - | -| `(checkboxChange)` | `(change)` | - | × | √ | - | -| `(radioChange)` | `(change)` | - | × | √ | - | -| `(sortChange)` | `(change)` | - | × | √ | - | -| `(filterChange)` | `(change)` | - | × | √ | - | -| `(rowClick)` | `(change)` | - | × | √ | - | -| `(rowDblClick)` | `(change)` | - | × | √ | - | - -> 一个示例说明 [#diff](https://github.com/ng-alain/ng-alain/pull/673/files#diff-f573fc0900f21b377dac432f1668c584L164) +| Old Property | New Property | Sub Property | ng update | Compatible 1.x | Description | +|-----------------------|--------------|-------------------|-----------|----------------|-------------| +| `[extraParams]` | `req` | `params` | - | - | - | +| `[reqReName]` | `req` | `reName` | - | - | - | +| `[reqMethod]` | `req` | `method` | - | - | - | +| `[reqHeader]` | `req` | `header` | - | - | - | +| `[reqBody]` | `req` | `body` | - | - | - | +| `[resReName]` | `res` | `reName` | - | - | - | +| `[preDataChange]` | `res` | `process` | - | - | - | +| `[frontPagination]` | `page` | `front` | - | - | - | +| `[zeroIndexedOnPage]` | `page` | `zeroIndexed` | - | - | - | +| `[pagePlacement]` | `page` | `placement` | - | - | - | +| `[showPagination]` | `page` | `show` | - | - | - | +| `[showSizeChanger]` | `page` | `showSize` | - | - | - | +| `[pageSizeOptions]` | `page` | `pageSizes` | - | - | - | +| `[showQuickJumper]` | `page` | `showQuickJumper` | - | - | - | +| `[showTotal]` | `page` | `total` | - | - | - | +| `[isPageIndexReset]` | `page` | `indexReset` | - | - | - | +| `[toTopInChange]` | `page` | `toTop` | - | - | - | +| `[toTopOffset]` | `page` | `toTopOffset` | - | - | - | +| `(checkboxChange)` | `(change)` | - | × | √ | - | +| `(radioChange)` | `(change)` | - | × | √ | - | +| `(sortChange)` | `(change)` | - | × | √ | - | +| `(filterChange)` | `(change)` | - | × | √ | - | +| `(rowClick)` | `(change)` | - | × | √ | - | +| `(rowDblClick)` | `(change)` | - | × | √ | - | + +> A demo [#diff](https://github.com/ng-alain/ng-alain/pull/673/files#diff-f573fc0900f21b377dac432f1668c584L164) + +e.g: + +```diff +- ++ +``` #### Column @@ -138,41 +182,41 @@ Because of the BEM style naming, you need to modify style name of `src/app/layou > 同时保持 `simple-table` 列描述的兼容性，且兼容会在 `3.x` 时被移除。 -| 原属性名 | 新属性名 | ng update | 兼容处理 | 描述 | -| ---------------------- | ---------------------------- | --------- | -------- | ---- | -| `sort` | `sort.default` | × | √ | - | -| `sorter` | `sort.compare` | × | √ | - | -| `sortKey` | `sort.key` | × | √ | - | -| `sortReName` | `sort.reName` | × | √ | - | -| `filter` | `fitler` | × | √ | - | -| `filters` | `fitler.menus` | × | √ | - | -| `filtered` | `fitler.default` | × | √ | - | -| `filterIcon` | `fitler.icon` | × | √ | - | -| `filterConfirmText` | `fitler.confirmText` | × | √ | - | -| `filterClearText` | `fitler.clearText` | × | √ | - | -| `filterMultiple` | `fitler.multiple` | × | √ | - | -| `filterKey` | `fitler.key` | × | √ | - | -| `filterReName` | `fitler.reName` | × | √ | - | -| `ynTruth` | `yn.truth` | × | √ | - | -| `ynYes` | `yn.yes` | × | √ | - | -| `ynNo` | `yn.no` | × | √ | - | -| `buttons.component` | `buttons.modal.component` | × | √ | - | -| `buttons.params` | `buttons.modal.params` | × | √ | - | -| `buttons.paramName` | `buttons.modal.paramsName` | × | √ | - | -| `buttons.size` | `buttons.modal.size` | × | √ | - | -| `buttons.modalOptions` | `buttons.modal.modalOptions` | × | √ | - | +| Old Property | New Property | ng update | Compatible 1.x | Description | +|------------------------|------------------------------|-----------|----------------|-------------| +| `sort` | `sort.default` | × | √ | - | +| `sorter` | `sort.compare` | × | √ | - | +| `sortKey` | `sort.key` | × | √ | - | +| `sortReName` | `sort.reName` | × | √ | - | +| `filter` | `fitler` | × | √ | - | +| `filters` | `fitler.menus` | × | √ | - | +| `filtered` | `fitler.default` | × | √ | - | +| `filterIcon` | `fitler.icon` | × | √ | - | +| `filterConfirmText` | `fitler.confirmText` | × | √ | - | +| `filterClearText` | `fitler.clearText` | × | √ | - | +| `filterMultiple` | `fitler.multiple` | × | √ | - | +| `filterKey` | `fitler.key` | × | √ | - | +| `filterReName` | `fitler.reName` | × | √ | - | +| `ynTruth` | `yn.truth` | × | √ | - | +| `ynYes` | `yn.yes` | × | √ | - | +| `ynNo` | `yn.no` | × | √ | - | +| `buttons.component` | `buttons.modal.component` | × | √ | - | +| `buttons.params` | `buttons.modal.params` | × | √ | - | +| `buttons.paramName` | `buttons.modal.paramsName` | × | √ | - | +| `buttons.size` | `buttons.modal.size` | × | √ | - | +| `buttons.modalOptions` | `buttons.modal.modalOptions` | × | √ | - | #### SimpleTableMultiSort -| 原属性名 | 新属性名 | ng update | 兼容处理 | 描述 | -| ---------------- | --------------- | --------- | -------- | ---- | -| `name_separator` | `nameSeparator` | × | × | - | +| Old Property | New Property | ng update | Compatible 1.x | Description | +|------------------|-----------------|-----------|----------------|-------------| +| `name_separator` | `nameSeparator` | × | × | - | ### chart 类库组件名变更 -| 原组件名 | 新组件名 | ng update | 描述 | -| ---------- | ----------- | --------- | ---- | -| `g2-chart` | `g2-custom` | - | - | +| Old Name | New Name | ng update | Description | +|------------|-------------|-----------|-------------| +| `g2-chart` | `g2-custom` | - | - | ## theme类库变更 @@ -196,8 +240,8 @@ Because of the BEM style naming, you need to modify style name of `src/app/layou ### Menu -| 原属性名 | 新属性名 | ng update | 兼容处理 | 描述 | -| --------------- | -------------- | --------- | -------- | ---- | -| `badge_dot` | `badgeDot` | × | × | - | -| `badge_status` | `badgeStatus` | × | × | - | -| `shortcut_root` | `shortcutRoot` | × | × | - | +| Old Property | New Property | ng update | Compatible 1.x | Description | +|-----------------|----------------|-----------|----------------|-------------| +| `badge_dot` | `badgeDot` | × | × | - | +| `badge_status` | `badgeStatus` | × | × | - | +| `shortcut_root` | `shortcutRoot` | × | × | - | diff --git a/docs/upgrade-v2.zh-CN.md b/docs/upgrade-v2.zh-CN.md index 7bbc0cf64..7d54ba675 100644 --- a/docs/upgrade-v2.zh-CN.md +++ b/docs/upgrade-v2.zh-CN.md @@ -82,13 +82,50 @@ ng-alain 2.0 启用全新的 [ng-alain 组织](https://github.com/ng-alain/)， | `simple-html-form` | `se` | - | - | | `standard-form-row` | `se` | - | - | +例如： + +```diff +- ++ +``` + +### 使用 `Input` 替代 `ContentChild` + +| 所属组件 | 原ContentChild | 新属性名 | ng update | 描述 | +|------------------|----------------|--------------|-----------|------| +| `st` | `body` | `body` | √ | - | +| `st` | `expand` | `expand` | √ | - | +| `footer-toolbar` | `extra` | `extra` | √ | - | +| `page-header` | `breadcrumb` | `breadcrumb` | √ | - | +| `page-header` | `logo` | `logo` | √ | - | +| `page-header` | `action` | `action` | √ | - | +| `page-header` | `content` | `content` | √ | - | +| `page-header` | `extra` | `extra` | √ | - | +| `page-header` | `tab` | `tab` | √ | - | + +例如： + +```diff +- ++ +- +- +``` + ### abc 类库组件属性名变更 -| 所属组件 | 原属性名 | 新属性名 | ng update | 描述 | -| ---------------- | ------------ | ---------- | --------- | -------------------------------- | -| `na-page-header` | `home_link` | `homeLink` | - | - | -| `na-page-header` | `home_i18n` | `homeI18n` | - | - | -| `st` | `sortReName` | 移除 | × | 仅使用 `STColumn.sort.reName` 值 | +| 所属组件 | 原属性名 | 新属性名 | ng update | 描述 | +|---------------|--------------|------------|-----------|----------------------------------| +| `page-header` | `home_link` | `homeLink` | - | - | +| `page-header` | `home_i18n` | `homeI18n` | - | - | +| `st` | `sortReName` | 移除 | × | 仅使用 `STColumn.sort.reName` 值 | + +例如： + +```diff +- ++ +``` ### abc 类库组件配置变更 @@ -132,6 +169,13 @@ ng-alain 2.0 启用全新的 [ng-alain 组织](https://github.com/ng-alain/)， > 一个示例说明 [#diff](https://github.com/ng-alain/ng-alain/pull/673/files#diff-f573fc0900f21b377dac432f1668c584L164) +例如： + +```diff +- ++ +``` + #### 列描述 将所有 `type` 所对应的属性重新定义为独立子属性使其列描述的定义更内聚，原 `SimpleTableColumn` 替换 `STColumn`。 diff --git a/packages/abc/footer-toolbar/demo/basic.md b/packages/abc/footer-toolbar/demo/basic.md index 744b587d4..5d1aa5277 100644 --- a/packages/abc/footer-toolbar/demo/basic.md +++ b/packages/abc/footer-toolbar/demo/basic.md @@ -16,8 +16,8 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms'; - - + + ` diff --git a/packages/abc/footer-toolbar/footer-toolbar.component.html b/packages/abc/footer-toolbar/footer-toolbar.component.html new file mode 100644 index 000000000..78fed3d9b --- /dev/null +++ b/packages/abc/footer-toolbar/footer-toolbar.component.html @@ -0,0 +1,7 @@ +
+ {{_extra}} +
+
+ + +
diff --git a/packages/abc/footer-toolbar/footer-toolbar.component.ts b/packages/abc/footer-toolbar/footer-toolbar.component.ts index 57ce8fb67..d683572b2 100644 --- a/packages/abc/footer-toolbar/footer-toolbar.component.ts +++ b/packages/abc/footer-toolbar/footer-toolbar.component.ts @@ -5,7 +5,6 @@ import { OnDestroy, Inject, TemplateRef, - ContentChild, ElementRef, Renderer2, } from '@angular/core'; @@ -17,13 +16,7 @@ const CLSBODY = 'footer-toolbar__body'; @Component({ selector: 'footer-toolbar', - template: ` -
-
- - -
- `, + templateUrl: './footer-toolbar.component.html', preserveWhitespaces: false, }) export class FooterToolbarComponent implements OnInit, OnDestroy { @@ -31,8 +24,17 @@ export class FooterToolbarComponent implements OnInit, OnDestroy { @InputBoolean() errorCollect = false; - @ContentChild('extra') - extra: TemplateRef; + _extra = ''; + _extraTpl: TemplateRef; + @Input() + set extra(value: string | TemplateRef) { + if (value instanceof TemplateRef) { + this._extra = null; + this._extraTpl = value; + } else { + this._extra = value; + } + } constructor( private el: ElementRef, diff --git a/packages/abc/footer-toolbar/footer-toolbar.spec.ts b/packages/abc/footer-toolbar/footer-toolbar.spec.ts index 7430225db..75cd5b9ee 100644 --- a/packages/abc/footer-toolbar/footer-toolbar.spec.ts +++ b/packages/abc/footer-toolbar/footer-toolbar.spec.ts @@ -12,45 +12,58 @@ describe('abc: footer-toolbar', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ - ErrorCollectModule.forRoot(), - FooterToolbarModule.forRoot(), - ], + imports: [ErrorCollectModule.forRoot(), FooterToolbarModule.forRoot()], declarations: [TestComponent], }); + }); + + function create() { fixture = TestBed.createComponent(TestComponent); dl = fixture.debugElement; context = fixture.componentInstance; fixture.detectChanges(); - }); + } it('should be create', () => { + create(); expect(dl.queryAll(By.css('.footer-toolbar')).length).toBe(1); }); it('should be load error-collect', () => { + create(); context.errorCollect = true; fixture.detectChanges(); expect(dl.queryAll(By.css('error-collect')).length).toBe(1); }); - it('should be custom extra template', () => { - expect(dl.queryAll(By.css('#extra')).length).toBe(1); + describe('#extra', () => { + it('with string', () => { + create(); + const left = dl.query(By.css('.footer-toolbar__left')) + .nativeElement as HTMLElement; + expect(left.textContent.trim()).toBe(`1`); + }); + it('with custom template', () => { + TestBed.overrideTemplate( + TestComponent, + ` + +
1
 + + `, + ); + create(); + expect(dl.queryAll(By.css('#extra')).length).toBe(1); + }); }); }); @Component({ template: ` -
- - -

extra

- - - -
- `, +
+ `, }) class TestComponent { errorCollect = true; + extra = '1'; } diff --git a/packages/abc/page-header/demo/image.md b/packages/abc/page-header/demo/image.md index 7f0b2fa4e..d7893549e 100644 --- a/packages/abc/page-header/demo/image.md +++ b/packages/abc/page-header/demo/image.md @@ -14,33 +14,34 @@ import { Component } from '@angular/core'; @Component({ selector: 'app-demo', template: ` - - - - 一级菜单 - 二级菜单 - 三级菜单 - - - -
- -
- - -

段落示意：蚂蚁金服务设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。

-
- - 快速开始 - - - 产品简介 - - - 产品文档 - -
- + + + + 一级菜单 + 二级菜单 + 三级菜单 + + + +
+ +
+ + +

段落示意：蚂蚁金服务设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。

+
+ + 快速开始 + + + 产品简介 + + + 产品文档 + +
+ ` }) diff --git a/packages/abc/page-header/demo/simple.md b/packages/abc/page-header/demo/simple.md index f7ba165c8..52137ed2c 100644 --- a/packages/abc/page-header/demo/simple.md +++ b/packages/abc/page-header/demo/simple.md @@ -12,7 +12,7 @@ import { Component } from '@angular/core'; @Component({ selector: 'app-demo', template: ` - + 一级菜单 diff --git a/packages/abc/page-header/demo/standard.md b/packages/abc/page-header/demo/standard.md index a61d6ddc0..baac503ee 100644 --- a/packages/abc/page-header/demo/standard.md +++ b/packages/abc/page-header/demo/standard.md @@ -14,7 +14,8 @@ import { Component } from '@angular/core'; @Component({ selector: 'app-demo', template: ` - + 一级菜单 diff --git a/packages/abc/page-header/demo/structure.md b/packages/abc/page-header/demo/structure.md index 909f31be4..a0297e33a 100644 --- a/packages/abc/page-header/demo/structure.md +++ b/packages/abc/page-header/demo/structure.md @@ -14,20 +14,21 @@ import { Component } from '@angular/core'; @Component({ selector: 'app-demo', template: ` - + 面包屑
action
content
extra
 - - - - - + + + + + - + `, styles: [` :host ::ng-deep .logo { diff --git a/packages/abc/page-header/page-header.component.ts b/packages/abc/page-header/page-header.component.ts index fa5857dbe..dbe888850 100644 --- a/packages/abc/page-header/page-header.component.ts +++ b/packages/abc/page-header/page-header.component.ts @@ -110,22 +110,22 @@ export class PageHeaderComponent paths: any[] = []; - @ContentChild('breadcrumb') + @Input() breadcrumb: TemplateRef; - @ContentChild('logo') + @Input() logo: TemplateRef; - @ContentChild('action') + @Input() action: TemplateRef; - @ContentChild('content') + @Input() content: TemplateRef; - @ContentChild('extra') + @Input() extra: TemplateRef; - @ContentChild('tab') + @Input() tab: TemplateRef; // endregion diff --git a/packages/abc/page-header/page-header.spec.ts b/packages/abc/page-header/page-header.spec.ts index 85e6610a4..5d08f271d 100644 --- a/packages/abc/page-header/page-header.spec.ts +++ b/packages/abc/page-header/page-header.spec.ts @@ -353,7 +353,8 @@ describe('abc: page-header', () => { template: ` + [fixed]="fixed" + [breadcrumb]="breadcrumb" [logo]="logo" [action]="action" [extra]="extra" [content]="content" [tab]="tab">
面包屑
action
 diff --git a/packages/abc/table/index.en-US.md b/packages/abc/table/index.en-US.md index 64570f0a8..98ffae6bb 100644 --- a/packages/abc/table/index.en-US.md +++ b/packages/abc/table/index.en-US.md @@ -56,8 +56,8 @@ Property | Description | Type | Default `[rowClickTime]` | Click twice in the time range for double click, unit is millisecond | `number` | `200` `[header]` | Table header renderer | `string,TemplateRef` | - `[footer]` | Table footer renderer | `string,TemplateRef` | - -`#body` | Table extra body renderer, generally used to add total rows | `TemplateRef` | - -`#expand` | Whether current column include expand icon | `TemplateRef` | - +`[body]` | Table extra body renderer, generally used to add total rows | `TemplateRef` | - +`[expand]` | Whether current column include expand icon | `TemplateRef` | - `(change)` | Events | `EventEmitter` | - `(error)` | Error event | `EventEmitter` | - (deprecated)`(sortChange)` | Sort event | `EventEmitter` | - diff --git a/packages/abc/table/index.zh-CN.md b/packages/abc/table/index.zh-CN.md index 42b418331..4aab5bb06 100644 --- a/packages/abc/table/index.zh-CN.md +++ b/packages/abc/table/index.zh-CN.md @@ -56,8 +56,8 @@ config: STConfig `[rowClickTime]` | 行单击多少时长之类为双击（单位：毫秒） | `number` | `200` `[header]` | 表格标题 | `string,TemplateRef` | - `[footer]` | 表格底部 | `string,TemplateRef` | - -`#body` | 表格额外内容，一般用于添加合计行 | `TemplateRef` | - -`#expand` | 当前列是否包含展开按钮，当数据源中包括 `expand` 表示展开状态 | `TemplateRef` | - +`[body]` | 表格额外内容，一般用于添加合计行 | `TemplateRef` | - +`[expand]` | 当前列是否包含展开按钮，当数据源中包括 `expand` 表示展开状态 | `TemplateRef` | - `(change)` | 变化时回调，包括：`pi`、`ps`、`checkbox`、`radio`、`sort`、`filter`、`click`、`dblClick` 变动 | `EventEmitter` | - `(error)` | 异常时回调 | `EventEmitter` | - (deprecated)`(sortChange)` | 排序回调 | `EventEmitter` | - diff --git a/packages/abc/table/table.component.ts b/packages/abc/table/table.component.ts index ec4da68a2..1d381de74 100644 --- a/packages/abc/table/table.component.ts +++ b/packages/abc/table/table.component.ts @@ -202,10 +202,10 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy { @Input() footer: string | TemplateRef; /** 额外 `body` 内容 */ - @ContentChild('body') + @Input() body: TemplateRef; /** `expand` 可展开，当数据源中包括 `expand` 表示展开状态 */ - @ContentChild('expand') + @Input() expand: TemplateRef<{ $implicit: any; column: STColumn }>; @Input() noResult: string | TemplateRef;