【问题标题】:Kendo - Unable to localize the string "TODAY" in the kendo date range component剑道 - 无法本地化剑道日期范围组件中的字符串“TODAY”
【发布时间】:2021-05-21 09:37:17
【问题描述】:

我正在研究一个剑道网格,我正在执行本地化并尝试翻译所有可见文本。

例如,我已经设法使用剑道网格消息组件将我的翻译应用到剑道网格上,如下所示:

<kendo-grid-messages
        pagerPage="{{ 'PAGE' | translate }}"
        pagerOf="{{ 'OF' | translate }}"
        pagerItems="{{ 'ITEMS' | translate }}"
        pagerLastPage="{{ 'GO_TO_THE_LAST_PAGE' | translate }}"
        pagerNextPage="{{ 'GO_TO_THE_NEXT_PAGE' | translate }}"
        pagerPreviousPage="{{ 'GO_TO_THE_PREVIOUS_PAGE' | translate }}"
        pagerFirstPage="{{ 'GO_TO_THE_FIRST_PAGE' | translate }}"
        noRecords="{{ 'NO_RECORDS_AVAILABLE' | translate }}">
  </kendo-grid-messages>

通过这种方式,我已经完成了自己的翻译 - 很棒。

为下拉菜单做了类似的事情:

<kendo-dropdownlist-messages
    noDataText="{{ 'NO_DATA_FOUND' | translate }}"
  >
</kendo-dropdownlist-messages>

太棒了!这两个 html 元素都在它们各自的父元素中。

现在我的网格中有一个 kendo-filter-date-range,如下所示:

<ng-template *ngIf="column.type === 'date'" kendoGridFilterCellTemplate let-filter let-column="column">
    <reporting-date-range-filter class="date-range-filter k-filtercell" [filter]="filter" [field]="column.field"
      [dateFormat]="dateFormat">
    </reporting-date-range-filter>
  </ng-template>

在深入了解实际组件时,我得到以下代码:

<div class="date-filter-container">
  <kendo-daterange>
   <kendo-dateinput class="range-filter" kendoDateRangeStartInput formatPlaceholder="short" [format]="dateFormat"
  [value]="start" (valueChange)="filterRange($event, end)">
   </kendo-dateinput>-
   <kendo-dateinput class="range-filter" kendoDateRangeEndInput formatPlaceholder="short" [format]="dateFormat"
  [value]="end" (valueChange)="filterRange(start, $event)">
   </kendo-dateinput>
  </kendo-daterange>
  <button *ngIf="hasFilter" class="k-button k-button-icon" title="{{'CLEAR' | translate}}" (click)="clearFilter()">
  <span class="k-icon k-i-filter-clear"></span>
  </button>
</div>

如您所见,我已将翻译应用到“清除”按钮。

现在是这样的:

我没有手动翻译该日历中的属性(天、月),但它自动选择了当前用户语言。

现在我正在努力将“今天”按钮中的文本更改为中文。

  • 我找不到任何 kendo-daterange 的自定义消息组件
  • kendo-datepicker-messages 似乎是唯一一个包含“today”属性的,但是一旦我在系统中发现更改所有内容并没有更新该日历。

我很高兴知道是否有人曾经本地化过该文本。 谢谢

【问题讨论】:

    标签: kendo-ui localization kendo-grid


    【解决方案1】:

    DateRange 有一个附加组件,用于控制弹出窗口中的日历。它被称为 MultiViewCalendar。

    我认为这应该可以解决您的问题,您可以忽略最小和最大日期:

    <kendo-daterange>
        <div class="form-group d-inline-block">
            <label class="label-control" [translate]="'dateFrom'"></label>
            <div class="d-inline-block"><kendo-dateinput class="form-control"  kendoDateRangeStartInput [(value)]="range.start"></kendo-dateinput></div>
        </div>
        <div class="form-group d-inline-block">
            <label class="label-control" [translate]="'dateTo'"></label>
            <div class="d-inline-block"><kendo-dateinput class="form-control" kendoDateRangeEndInput [(value)]="range.end"></kendo-dateinput></div>
        </div>
        <kendo-daterange-popup>
          <ng-template kendoDateRangePopupTemplate>
              <kendo-multiviewcalendar kendoDateRangeSelection [min]="minDate" [max]="maxDate">
                <kendo-multiviewcalendar-messages today="yourTranslation"></kendo-multiviewcalendar-messages>
              </kendo-multiviewcalendar>
          </ng-template>
      </kendo-daterange-popup>
    </kendo-daterange>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-11-02
      • 1970-01-01
      • 1970-01-01
      • 2016-12-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多