Question

我正在使用ExtJS，并且添加了一些项目，例如pickerdate，按钮...我想将这些项目翻译成我的母语，因为默认情况下它们是英文的。

我一直在搜索它，发现我应该拥有国际化文件，但是我没有，因为我只有这两个文件：

index.html

<html> 
  <head>
        <!-- <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> -->
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>Test</title>

        <!-- CDN 4.2.1- NEPTUNE -->
        <link href="http://cdn.sencha.io/ext/gpl/4.2.1/resources/css/ext-all-neptune.css" rel="stylesheet" />
        <script src="http://cdn.sencha.com/ext/gpl/4.2.1/ext-all.js"></script>
        <link href="http://cdn.sencha.io/ext/gpl/4.2.1/resources/css/ext-all-neptune.css" rel="stylesheet" />

        <!-- JScript -->
        <script type="text/javascript" src="/assets/js/app.js"></script>
    </head>

    <body>
    </body>

</html>

app.js

    Ext.application({
        name: 'MyApp',
        launch: function() {            
            const datePickers = Ext.create('Ext.form.Panel', {
                renderTo: Ext.getBody(),
                width: 300,
                bodyPadding: 10,
                items: [{
                    xtype: 'datefield',
                    format: 'd/m/Y',
                    anchor: '100%',
                    fieldLabel: 'Check In:',
                    name: 'from_date',
                    minValue: new Date(),
                    listeners: {
                        'change': function(me) {

                        }
                    }
                }, {
                    xtype: 'datefield',
                    format: 'd/m/Y',
                    anchor: '100%',
                    fieldLabel: 'Check Out:',
                    name: 'to_date',
                    minValue: new Date(),
                    listeners: {
                        'change': function(me) {

                        }
                    }
                }]
            });

            Ext.create('Ext.container.Viewport', {
                items: [{
                    title: 'Y',
                    region: 'west',
                    collapsible: true,
                    split: true,
                    titleCollapse: true,
                    items: [{
                        items: datePickers
                    }],
                }]
            });
        }
    });

如您所见，英语是这些日期选择器的默认语言：

是否可以将它们翻译成所需的语言？我只需要翻译月份和“今天”按钮，但是如果有完整的翻译，那就更好了。

预先感谢

Answer 1

您可以通过覆盖Ext.picker.Date来简化操作。只需将Ext.locale.en.picker.Date更改为您的名字即可。 Ext.locale.pl.picker.Date并按如下所示更改参数：

Ext.define("Ext.locale.en.picker.Date", {
    override: "Ext.picker.Date",
    todayText: "Today",
    minText: "This date is before the minimum date",
    maxText: "This date is after the maximum date",
    disabledDaysText: "",
    disabledDatesText: "",
    nextText: 'Next Month (Control+Right)',
    prevText: 'Previous Month (Control+Left)',
    monthYearText: 'Choose a month (Control+Up/Down to move years)',
    todayTip: "{0} (Spacebar)",
    format: "m/d/y",
    startDay: 0
});

要翻译其他日期字符串：

if (Ext.Date) {
    Ext.Date.monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];

    Ext.Date.getShortMonthName = function (month) {
        return Ext.Date.monthNames[month].substring(0, 3);
    };

    Ext.Date.monthNumbers = {
        January: 0,
        Jan: 0,
        February: 1,
        Feb: 1,
        March: 2,
        Mar: 2,
        April: 3,
        Apr: 3,
        May: 4,
        June: 5,
        Jun: 5,
        July: 6,
        Jul: 6,
        August: 7,
        Aug: 7,
        September: 8,
        Sep: 8,
        October: 9,
        Oct: 9,
        November: 10,
        Nov: 10,
        December: 11,
        Dec: 11
    };

    Ext.Date.getMonthNumber = function (name) {
        return Ext.Date.monthNumbers[name.substring(0, 1).toUpperCase() + name.substring(1, 3).toLowerCase()];
    };

    Ext.Date.dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

    Ext.Date.getShortDayName = function (day) {
        return Ext.Date.dayNames[day].substring(0, 3);
    };

    Ext.Date.parseCodes.S.s = "(?:st|nd|rd|th)";

    Ext.Date.firstDayOfWeek = 0;
    Ext.Date.weekendDays = [6, 0];
}

要将月份标题更改为3个字母，您需要在Ext.picker.Date中更改renderTpl。

做这样的事情：

Ext.define('Ext.override.picker.Date', {
    override: "Ext.picker.Date",
    getDayInitial: function (value) {
        return value.substr(0, 3);
    }
});

更改了getDayInitial函数以呈现3个字母。

如何翻译ExtJS中的项目？

1 个答案: