angular input输入框中使用filter格式化日期

最近使用了angular日期选择器，不过需要把选中的日期输出到input输入框中，如果按照默认情况，显示的是时间戳形式的时间，不符合要求，需要把格式变成特定格式，但是input上ng-model上又不能直接使用filter，因此需要一种方法把这里显示的内容格式化。

网上寻找解决方案就是写个directive，具体实例代码如下：

JS

 

angular.module('dateRange',[]).directive('dateFormat', ['$filter',function($filter) {
    var dateFilter = $filter('date');
    return {
        require: 'ngModel',
        link: function(scope, elm, attrs, ctrl) {

            function formatter(value) {
                return dateFilter(value, 'yyyy-MM-dd'); //format
            }

            function parser() {
                return ctrl.$modelValue;
            }

            ctrl.$formatters.push(formatter);
            ctrl.$parsers.unshift(parser);

        }
    };
}]);

 

 

HTML

 

<input type="text" ng-model="start_date" date-format disabled="disabled">

显示效果如图，具体的格式化修改代码中的format即可。