angularjs - 在angularjs中使用ui-date时如何将初始值设置为ng-model

Question

我的模型基于 JSON 对象，日期为 2012-12-13T00:00:00-07:00

我想使用日期选择器 ui-date。

我有以下有效的代码。

<input ng-model="course.startDate" value="{{item.startDate | date: 'MM/dd/yyyy'}}" ui-date ng-required="true">

但是，我认为我不应该使用 value="{{item.startDate | date: 'MM/dd/yyyy'}}" 部分，但如果没有它，输入就不会不加载模型中的值。

当我选择日期时，模型已绑定(bind)并正常运行，但在页面加载时它仅显示为空。

初始化此输入的正确方法是什么？

Answer 1

使用 ui-date 和 ng-model 就足够了:

<div ng-controller="MyCtrl">
  <input ng-model="date" ui-date>
</div>

假设MyCtrl定义如下:

function MyCtrl($scope) {
    $scope.date= new Date();
}​

这是一个jsFiddle:http://jsfiddle.net/MvGFF/2/

您必须知道的是，ui-date 期望模型值是 Date 的实例，也许您正在传递一个字符串(或其他类型)值？

如果您的模型保存的是字符串值，并且您仍然想使用日期选择器，则需要添加 ui-date-format 指令，如下例所示:

<input ng-model="date" ui-date ui-date-format>

Controller 的定义如下:

function MyCtrl($scope) {
    $scope.date= "2012-12-13T00:00:00-07:00";
}​

这是一个jsFiddle:http://jsfiddle.net/d4xz2/1/