angularjs - 如何以角度形式更改 Angular UI Datepicker 模型值格式？

Question

这是角度形式的UI Datepicker的默认格式

  {
    "date": "2015-10-05T18:30:00.000Z"
  }

如何将上述格式更改为

  {
    "date": "2015/10/05"
  }

这是 JSBIN：http ://jsbin.com/cadaga/2/edit?html,js,output

Answer 1

通常，在模型中，您像已有的一样以 ISO 格式存储日期，并使用date过滤器（文档）根据需要在视图中对其进行格式化：

<div>{{vm.model.date | date: 'yyyy/MM/dd'}}</div>

如果您仍然想更改模型中的格式，请注入$filter并使用date过滤器，如下所示：

$filter('date')(date_value, format, timezone)

例如：

$filter('date')(vm.model.date, 'yyyy/MM/dd');

或者，如果您经常处理日期，那么像moment.js这样的库可能会很有用。

---

编辑：注意到您想使用 datepicker 组件在 angular-formly 的具体上下文中更改日期模型值。该组件需要日期模型值采用标准格式，但您可以做的是拥有另一个具有相应格式日期的属性，您可以在更改日期输入时设置该属性：

HTML（在 datepicker 上input）：

ng-change="vm.setFormattedDate(dt)"

控制器：

vm.setFormattedDate = function (datetime) {
    vm.model.formattedDate = $filter('date')(datetime, 'yyyy/MM/dd');
}