feat(module:abc.st): add total i18n

packages/abc/table/table.component.ts

@@ -11,7 +11,6 @@ import {
  ElementRef,
  TemplateRef,
  SimpleChange,
- ContentChild,
  Optional,
  AfterViewInit,
  ChangeDetectionStrategy,
@@ -30,7 +29,8 @@ import {
  ALAIN_I18N_TOKEN,
  AlainI18NService,
  DrawerHelper,
- DrawerHelperOptions
+ DrawerHelperOptions,
+ DelonLocaleService,
 } from '@delon/theme';
 import {
  deepCopy,
@@ -81,7 +81,10 @@ import { STDataSource } from './table-data-source';
 })
 export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  private i18n$: Subscription;
+ private delonI18n$: Subscription;
  private totalTpl = ``;
+ private locale: any = {};
+ private clonePage: STPage;
  _data: STData[] = [];
  _isPagination = true;
  _allChecked = false;
@@ -144,13 +147,14 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  return this._page;
  }
  set page(value: STPage) {
+ this.clonePage = value;
  const { page } = this.cog;
  const item = Object.assign({}, deepCopy(page), value);
  const { total } = item;
  if (typeof total === 'string' && total.length) {
  this.totalTpl = total;
  } else if (toBoolean(total)) {
- this.totalTpl = `共 {{total}} 条`;
+ this.totalTpl = this.locale.total;
  } else {
  this.totalTpl = '';
  }
@@ -240,7 +244,7 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  @Output()
  readonly checkboxChange: EventEmitter<STData[]> = new EventEmitter<
  STData[]
-  >();
+ >();
  /**
  * radio变化时回调，参数为当前所选
  * @deprecated 使用 `change` 替代
@@ -270,7 +274,7 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  @Output()
  readonly rowClick: EventEmitter<STChangeRowClick> = new EventEmitter<
  STChangeRowClick
-  >();
+ >();
  /**
  * 行双击回调
  * @deprecated 使用 `change` 替代
@@ -279,7 +283,7 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  @Output()
  readonly rowDblClick: EventEmitter<STChangeRowClick> = new EventEmitter<
  STChangeRowClick
-  >();
+ >();
  //#endregion
 
  constructor(
@@ -297,7 +301,17 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  @Inject(DOCUMENT) private doc: any,
  private columnSource: STColumnSource,
  private dataSource: STDataSource,
+ private delonI18n: DelonLocaleService,
  ) {
+ this.delonI18n$ = this.delonI18n.change.subscribe(
+ () => {
+ this.locale = this.delonI18n.getData('st');
+ if (this._columns.length > 0) {
+ this.page = this.clonePage;
+ this.cd.detectChanges();
+ }
+ },
+ );
  Object.assign(this, deepCopy(cog));
  if (i18nSrv) {
  this.i18n$ = i18nSrv.change
@@ -309,9 +323,9 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  renderTotal(total: string, range: string[]) {
  return this.totalTpl
  ? this.totalTpl
- .replace('{{total}}', total)
- .replace('{{range[0]}}', range[0])
- .replace('{{range[1]}}', range[1])
+  .replace('{{total}}', total)
+  .replace('{{range[0]}}', range[0])
+  .replace('{{range[1]}}', range[1])
  : '';
  }
 
@@ -614,12 +628,13 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  const { drawer } = btn;
  obj[drawer.paramsName] = record;
  const options: DrawerHelperOptions = Object.assign({}, drawer);
- this.drawerHelper.create(
- drawer.title,
- drawer.component,
- Object.assign(obj, drawer.params && drawer.params(record)),
- Object.assign({}, drawer)
- )
+ this.drawerHelper
+ .create(
+ drawer.title,
+ drawer.component,
+ Object.assign(obj, drawer.params && drawer.params(record)),
+ Object.assign({}, drawer),
+ )
  .pipe(filter(w => typeof w !== 'undefined'))
  .subscribe(res => this.btnCallback(record, btn, res));
  return;
@@ -705,6 +720,7 @@ export class STComponent implements AfterViewInit, OnChanges, OnDestroy {
  }
 
  ngOnDestroy(): void {
+ this.delonI18n$.unsubscribe();
  if (this.i18n$) this.i18n$.unsubscribe();
  }
 }

packages/abc/table/test/table.spec.ts

@@ -12,11 +12,12 @@ import {
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { Router } from '@angular/router';
+import { of, Observable, Subject } from 'rxjs';
 
 import { NgZorroAntdModule, NzPaginationComponent } from 'ng-zorro-antd';
 import { ModalHelper, ALAIN_I18N_TOKEN, DatePipe } from '@delon/theme';
 import { deepCopy, deepGet } from '@delon/util';
-import { of, Observable, Subject } from 'rxjs';
+import { DelonLocaleModule, en_US, zh_CN, DelonLocaleService } from '@delon/theme';
 
 import {
  STColumn,
@@ -97,6 +98,7 @@ describe('abc: table', () => {
  RouterTestingModule.withRoutes([]),
  NgZorroAntdModule.forRoot(),
  STModule.forRoot(),
+ DelonLocaleModule
  ];
  const providers = [];
  if (other.providers && other.providers.length) {
@@ -1271,6 +1273,16 @@ describe('abc: table', () => {
  i18nSrv = injector.get(ALAIN_I18N_TOKEN);
  spyOn(i18nSrv, 'fanyi').and.callFake(() => curLang);
  });
+ it('should working', (done: () => void) => {
+ page.newColumn([{ title: '', i18n: curLang, index: 'id' }]).then(() => {
+ const el = page.getEl('.ant-pagination-total-text');
+ expect(el.textContent.trim()).toContain(`共`);
+ injector.get(DelonLocaleService).setLocale(en_US);
+ fixture.detectChanges();
+ expect(el.textContent.trim()).toContain(`of`);
+ done();
+ });
+ });
  it('should be re-render columns when i18n changed', (done: () => void) => {
  page.newColumn([{ title: '', i18n: curLang, index: 'id' }]).then(() => {
  page.expectHead(curLang, 'id');

packages/theme/src/locale/languages/en-US.ts

@@ -25,6 +25,9 @@ export default <LocaleData>{
  miniProgress: {
  target: 'Target: ',
  },
+ st: {
+ total: '{{range[0]}} - {{range[1]}} of {{total}}',
+ },
  sf: {
  submit: 'Submit',
  reset: 'Reset',

packages/theme/src/locale/languages/zh-CN.ts

@@ -25,6 +25,9 @@ export default <LocaleData>{
  miniProgress: {
  target: '目标值：'
  },
+ st: {
+ total: '共 {{total}} 条',
+ },
  sf: {
  submit: '提交',
  reset: '重置',

packages/theme/src/locale/languages/zh-TW.ts

@@ -25,6 +25,9 @@ export default <LocaleData>{
  miniProgress: {
  target: '目標值：',
  },
+ st: {
+ total: '共 {{total}} 條',
+ },
  sf: {
  submit: '提交',
  reset: '重置',

packages/theme/src/locale/locale.types.ts

@@ -26,6 +26,10 @@ export interface MiniProgressLocaleData {
  target: string;
 }
 
+export interface STLocaleData {
+ total: string;
+}
+
 export interface SFLocaleData {
  submit: string;
  reset: string;
@@ -40,5 +44,6 @@ export interface LocaleData {
  reuseTab: ReuseTabLocaleData;
  tagSelect: TagSelectLocaleData;
  miniProgress: MiniProgressLocaleData;
+ st: STLocaleData;
  sf: SFLocaleData;
 }