UI 网格上的日期输入

Question

我有一个 AngularJS ui 网格，用于显示包括日期在内的几个字段。日期来自服务器，格式如下：2018-01-31。在列定义上，我有类似的内容：

.columnDefs = [
...
      { name: 'startDate', displayName: 'Start Date', width: 170, enableHiding: false, cellTemplate: dateCellTemplate},
     ];

我已经添加了 type: 'date' 和 cellFilter: 'date:\'yyyy-MM-dd\''，其中 none 成功了。

模板只有一个日期输入，如下所示：

const dateCellTemplate = '<div><input type="date" ng-model="MODEL_COL_FIELD" ng-change="grid.appScope.saveEdit(row)"></div>'

每当我收到服务器响应时，我的 js 控制台都会显示以下错误。

Error: [ngModel:datefmt] http://errors.angularjs.org/1.4.8/ngModel/datefmt?p0=2018-01-24

Answer 1

您需要在使用前将模型转换为 Date 对象。使用

new Date(your date here);

这是因为您正在使用输入类型 Date 并且 angular 需要日期类型而不是字符串。

Date input on UI Grid