Question

您好我想使用JQuery-UI datepicker作为AngularJS指令。我觉得我差不多了，但是如果初始数据的格式不正确，那么JQuery-UI日期选择器不会格式化初始数据。我为人们创建了一个JSFiddle，并且想知道解决这个问题最优雅的方法是什么？

http://jsfiddle.net/cnrWY/

和代码简而言之 HTML：

<div ng-app="myApp">
    <div ng-controller="myController">
        <input id="myDateInput" type="text" ng-model="myDateTime" datepicker />
    </div>
</div>

JS：

var myApp = angular.module('myApp', function() { })
.directive('datepicker', function () { 
    return {        
        restrict: 'A',
        require: 'ngModel',
        link: function(scope, element, attrs, ngModelCtrl) {
            $(function () {
                $(element).datepicker({                    
                    dateFormat: 'mm/dd/yy',
                    onSelect: function(date) {
                        ngModelCtrl.$setViewValue(date);
                    }
                });
            });
        }    
    }
}).controller('myController', function($scope) {
    $scope.myDateTime = new Date();
});

注意：我尝试在指令中放置格式，但有时日期还没有。就像在值在输入/范围之前的指令触发一样。

由于

Answer 1

问题是，在您明确选择日期之前，不会触发onSelect事件。因此模型不会更新。您应该观察您的模型并自行格式化。

为什么不尝试使用ui-date指令？

正确使用JQuery-UI datepicker格式初始日期

1 个答案: