javascript - angualr-ui-bootstrap提供的datepicker 控件，绑定ng-model失效。

Question

两个input框，都已经用ng-model绑定，用于呈现从后台获取的数据。但是因为第一个input内写了uib-datepicker-popup="yyyy-MM-dd HH:mm:ss"导致绑定的数据无法写到input内。

这张图是点击时间控件之后出现的效果，因为第一个input对时间进行了格式化，所以显示的数据满足要求。

现在的问题就是如何在确保页面加载完成后第一个input框既能显示获取的数据，又要保证点击时间控件按钮的时候获得的时间满足格式要求呢？

第一次提问，语言组织的有点乱，还望看到的朋友见谅！
希望有爱的朋友能解答一下这个问题

Answer 1

我之前也遇到过这个问题，ng-bootstrap的时间格式默认是date object，我也遇到过这个问题，我写了个directive把date-picker的事件对象直接转成string。

.directive('dateModelFormat', ['dateFilter', '$parse', function(dateFilter, $parse){
    return {
        restrict: 'A',
        require:'?ngModel',
        link: function(scope, element, attr, ngModel){
            ngModel.$parsers.push(function(viewValue){
                return dateFilter(viewValue, 'yyyy-MM-dd');
            });
        }
    }
}])