3

双向数据绑定似乎导致对该字段的错误更新。单击该字段会提高日期选择器的精度，但如果您尝试通过直接输入日期来编辑该字段，它就不起作用了。

这是演示问题的小提琴：http: //jsfiddle.net/vSNJF/

<input type="text" ng-model="name" ui-date-format='m/d/yy' ui-date>

在此处将 Angular 下的键盘编辑与标准 jquery UI 日期选择器行为进行比较：http: //jqueryui.com/datepicker/

如何使 ui-date 延迟更新模型，直到交互式日历被关闭？

4

1 回答 1

1

你有一个相当大的指令，我不确定是否有人会通过整个代码来找出导致问题的原因。为了提供帮助，我将留下一个更简单的 datepicker 指令，该指令的行为与 Jquery UI 完全相同，但没有您在您的 UI 中实现的所有功能，也许如果您从这一点开始并添加功能，调试问题会更容易。

该指令是：

directive('datepicker', function() {
    return {
        restrict: 'A',
        require : 'ngModel',
        link : function (scope, element, attrs, ngModelCtrl) {
            $(function(){
               element.datepicker({
                    dateFormat:'dd/mm/yy',
                    onSelect:function (date) {
                        ngModelCtrl.$setViewValue(date);
                        scope.$apply();
                    }
                });
            });
        }
    }
});

这是一个Plunker和一篇关于它的博客文章。

于 2013-06-17T20:21:28.893 回答