diff --git a/packages/theme/src/services/i18n/i18n.pipe.ts b/packages/theme/src/services/i18n/i18n.pipe.ts index 6d35812bc..f5ff52f66 100644 --- a/packages/theme/src/services/i18n/i18n.pipe.ts +++ b/packages/theme/src/services/i18n/i18n.pipe.ts @@ -1,12 +1,12 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; -import { AlainI18NService, ALAIN_I18N_TOKEN } from './i18n'; +import { ALAIN_I18N_TOKEN } from './i18n'; @Pipe({ name: 'i18n', standalone: true }) export class I18nPipe implements PipeTransform { - constructor(@Inject(ALAIN_I18N_TOKEN) private i18n: AlainI18NService) {} + private readonly i18n = inject(ALAIN_I18N_TOKEN); - transform(key: string, params?: Record): string { + transform(key: string, params?: unknown | unknown[]): string { return this.i18n.fanyi(key, params); } } diff --git a/packages/theme/src/services/i18n/i18n.spec.ts b/packages/theme/src/services/i18n/i18n.spec.ts index e902bed18..71fecbcb5 100644 --- a/packages/theme/src/services/i18n/i18n.spec.ts +++ b/packages/theme/src/services/i18n/i18n.spec.ts @@ -30,7 +30,8 @@ describe('theme: i18n', () => { srv = fixture.debugElement.injector.get(ALAIN_I18N_TOKEN); srv.use('en', { simple: 'a', - param: 'a-{{value}}' + param: 'a-{{value}}', + paramArr: 'a-{0},{ 1 }' }); fixture.detectChanges(); }); @@ -38,11 +39,31 @@ describe('theme: i18n', () => { check('a'); }); - it('should be param', () => { - fixture.componentInstance.key = 'param'; - fixture.componentInstance.params = { value: '1' }; - fixture.detectChanges(); - check('a-1', 'param'); + describe('#param', () => { + it('with object', () => { + fixture.componentInstance.key = 'param'; + fixture.componentInstance.params = { value: '1' }; + fixture.detectChanges(); + check('a-1', 'param'); + }); + it('with base type', () => { + fixture.componentInstance.key = 'paramArr'; + fixture.componentInstance.params = 'A'; + fixture.detectChanges(); + check('a-A,{ 1 }', 'param'); + }); + it('with base type', () => { + fixture.componentInstance.key = 'paramArr'; + fixture.componentInstance.params = 100; + fixture.detectChanges(); + check('a-100,{ 1 }', 'param'); + }); + it('with array', () => { + fixture.componentInstance.key = 'paramArr'; + fixture.componentInstance.params = [1, 2]; + fixture.detectChanges(); + check('a-1,2', 'param'); + }); }); it('should be return path when is invalid', () => { diff --git a/packages/theme/src/services/i18n/i18n.ts b/packages/theme/src/services/i18n/i18n.ts index 85db2183a..957e14d24 100644 --- a/packages/theme/src/services/i18n/i18n.ts +++ b/packages/theme/src/services/i18n/i18n.ts @@ -52,7 +52,7 @@ export interface AlainI18NService { * @param params 模板所需要的参数对象 * @param isSafe 是否返回安全字符,自动调用 `bypassSecurityTrustHtml`; Should be removed, If you need SafeHtml support, please use `| html` pipe instead. */ - fanyi(path: string, params?: unknown): string; + fanyi(path: string, params?: unknown | unknown[]): string; } export const ALAIN_I18N_TOKEN = new InjectionToken('alainI18nToken', { @@ -122,20 +122,27 @@ export abstract class AlainI18nBaseService implements AlainI18NService { abstract getLangs(): NzSafeAny[]; - fanyi(path: string, params?: Record): string { + fanyi(path: string, params?: unknown | unknown[]): string { let content = this._data[path] || ''; if (!content) return path; - if (params) { + if (!params) return content; + + if (typeof params === 'object') { const interpolation = this.cog.interpolation!!; - Object.keys(params).forEach( + const objParams = params as Record; + Object.keys(objParams).forEach( key => (content = content.replace( - new RegExp(`${interpolation[0]}\s?${key}\s?${interpolation[1]}`, 'g'), - `${params[key]}` + new RegExp(`${interpolation[0]}\\s?${key}\\s?${interpolation[1]}`, 'g'), + `${objParams[key]}` )) ); } + + (Array.isArray(params) ? params : [params]).forEach( + (item, index) => (content = content.replace(new RegExp(`\\{\\s?${index}\\s?\\}`, 'g'), `${item}`)) + ); return content; } }