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

2023年8月17日 244次阅读

我的模型基于
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’}}”部分,但没有它,输入不会加载模型中的值.

当我选择日期时,模型被绑定并正常运行,当页面加载时它只显示为空.

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

最佳答案 使用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>

控制器定义如下：

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

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

点赞