Question

我将一个日期从数据库拉到带有angular2的vaadin-grid（vaadin-table）。我需要的只是MM / DD / YYYY格式。日期过滤器在{{dateOfBirth |。}中的vaadin-grid中不起作用日期： '日/月/年'}}

谢谢！这些例子对我来说最有意义，因为我对vaadin很新。

Answer 1

我不是Vaadin聚合物和专家的专家。 angular2因为我主要使用经典 Vaadin，但是看their samples (currently line 182)，看起来你可以提供一个渲染器。 expanse manager demo的第一列有Date，在源中您也可以使用moment.js库查看渲染器：

grid.columns[0].renderer = function(cell) {
  cell.element.innerHTML = moment(cell.data).format('MM/DD/YYYY');
};

生成：

如果您查看moment.js's formatting options，可以将其更改为您喜欢的任何内容，例如DD/MM/YYYY。这是一个基本的JSFiddle正在这样做（对不起，SO代码片段给出了一个我无法弄清楚的错误......）。

Answer 2

选择日期（vaadin-date-picker）时格式化为vaadin-date输入的DD / MM / YYYY。

toDDMMYYYY = function(dateFromInput){ //DD/MM/YYYY
           dateFromInput.set('i18n.formatDate', function(d) {
             var yearStr = d.getFullYear().toString();
             var dateFormatted =  d.getDate() + '/' + (d.getMonth() + 1) + '/' + yearStr;
             return dateFormatted
           });
           dateFromInput.set('i18n.parseDate', function(t) {
             var parts = t.split('/');
             var today = new Date();
             var date, month = today.getMonth(), year = today.getFullYear();

             if (parts.length === 3) {
               year = parseInt(parts[2]);
               if (parts[2].length < 3 && year >= 0) {
                 year += year < 50 ? 2000 : 1900;
               }
               month = parseInt(parts[1]) - 1;
               date = parseInt(parts[0]);
             } else if (parts.length === 2) {
               month = parseInt(parts[1]) - 1;
               date = parseInt(parts[0]);
             } else if (parts.length === 1) {
               date = parseInt(parts[1]);
             }
             if (date !== undefined) {
               var result = new Date(0, 0); // Wrong date (1900-01-01), but with midnight in local time
               result.setFullYear(year);
               result.setMonth(month);
               result.setDate(date);
               return result;
             }
           });
         };

在vaadin-grid中更改日期格式

2 个答案: