Question

我从API返回了许多资源，需要将日期字符串转换为Date对象，以便它们可以由md-datepicker（Angular Material）呈现。

首先，我只是在每个服务中执行此操作（事实上，我从每个服务调用另一个服务，将字符串转换为日期），但这变得难以维护。

所以我试图通过扩展md-datepicker指令来实现这一点，但我不知道如何修改该值 - 每个用法将有一个不同的父控制器。

这是我得到的：的 app.js

.directive('customDatePicker', function(DatesService) {
    return {
        restrict: 'A',
        require: 'mdDatepicker',
        scope: {
            date: '='
        },
        link: function(scope, element, attrs, controller, transcludeFn) {               
            // access value in scope here 
            console.log(scope);
        }
    }
})

修改-task.html

<md-datepicker custom-date-picker date="TaskDetailCtrl.task.start_date" ng-model="TaskDetailCtrl.task.start_date">
</md-datepicker>

我认为通过使用隔离范围我可以更容易地获得值 - 并且无论使用哪个控制器都没关系（没有范围选项，我可以看到值但是必须知道它的名称控制器）。

不幸的是，I get a Multiple Directive Resource Contention Error.

对此有更好的解决方案吗？

Answer 1

只需通过attr指令

添加格式化程序

.directive('myDate', function(){
   return {
      restrict: 'A',
      require: 'ngModel',
      link: function(scope, iElem, iAttrs, ngModelCtrl){
          ngModelCtrl.$formatters.unshift(function(modelValue){
              return modelValue && new Date(modelValue);
          });
      }
   };
})

在渲染md-datepicker

1 个答案: