同步融合网格标题的本地化[Aurelia]

时间:2018-03-28 12:29:17

标签: javascript internationalization aurelia syncfusion

我正在使用i18n插件进行Aurelia应用程序的本地化。但是,本地化并未在我们的Aurelia应用程序中动态地应用于同步融合网格上的列标题。

Grid的html代码如下所示。

<ej-grid id="gvDownline"  e-locale.bind="locale" 
           e-data-source.bind="downlines"
           e-page-settings.bind="pageSettings"
           e-allow-paging=true
           e-allow-sorting=true
           e-allow-text-wrap=true
           e-text-align="center">
    <ej-column e-width="80"    e-field="level" e-header-text="${i18n.tr('Downline.Level')}" e-text-align="right">
    </ej-column>
    <ej-column e-field="sponsor" e-header-text="${i18n.tr('Downline.Sponsor')}" e-text-align="left">
    </ej-column>
    <ej-column e-field="sponsorEmail" e-header-text="${i18n.tr('Downline.SponsorEmail')}" e-text-align="center">
    <ej-column e-field="associate" e-header-text="${i18n.tr('Downline.Associate')}" e-text-align="center">
    <ej-column e-field="registeredFlag" e-width="130" e-header-text="${i18n.tr('Downline.Registered')}" e-text-align="right">
    </ej-column>
    <ej-column e-field="contractSignedDate"  e-format="{0:dd/MM/yyyy}" e-header-text="${i18n.tr('Downline.ContractSignedDate')}" e-text-align="right">
    </ej-column>
  </ej-grid>

在后面的代码中,我导入了以下文件,用于分页和其他网格组件的本地化。

import 'syncfusion-ej-global/l10n/ej.localetexts.it-IT.min';

我们提供i18n.tr(‘key’)作为列的e-header-text属性,以便将其翻译。

在我的页面中,有两种语言选项。当我更改语言选项时,我需要根据所选语言将本地化应用于网格标题。当我在网格中应用e-locale.bind="locale"属性时,本地化将应用于同步融合网格的分页和状态信息,但不会应用于网格标题。

我必须执行页面重新加载,以便在每次语言切换后应用标头的本地化。实际上,我需要在语言更改事件后面的代码(ts文件)中设置标题文本。任何人都可以建议一种更好的方法来实现Aurelia中同步融合网格的本地化。

1 个答案:

答案 0 :(得分:0)

您可以使用TBindingBehavior进行此操作。它会监听BindingSignaler,这可能会使其无需任何其他代码,但如果它仍然不起作用,您可以选择手动发送更新信号。

e-header-text="${i18n.tr('Downline.Level')}"将更改为:

e-header-text="${'Downline.Level' & t}"

并手动发送更新信号(来自文档):

setLocale(locale) {
  return new Promise( resolve => {
    let oldLocale = this.getLocale();
    this.i18next.setLng(locale, tr => {
      this.ea.publish('i18n:locale:changed', { oldValue: oldLocale, newValue: locale });
      this.signaler.signal('aurelia-translation-signal');
      resolve(tr);
    });
  });
}

this.signaler注入的BindingSignaler

还描述了here