AngularJs - 在指令控制器中使用自定义过滤器

Question

场景
我有一组用户包含有关它们的信息,我ng-repeat结合自定义指令生成HTML用户卡,保持每张卡的范围相对于单个用户,在用户模型中有一个我需要的值在模板编译之前使用自定义过滤器进行过滤,因为如果我在模板内部进行过滤,则过滤所需的时间会使工具提示在值准备好之前不显示,看起来好像有些东西不起作用.

我的代码到目前为止

// userCard directive
angular.module('userCard', []).directive('UserCard', function() {
  return {
    restrict: 'EA',
    templateUrl: 'userCard.tpl.html',
    scope: {
        user: '='
    },
    controller: ['$scope', 'fromNowFilter', function($scope, fromNowFilter) {

        angular.forEach($scope.user.reminders, function(reminder) {
            reminder.last_sent = reminder.last_sent === null ? 'No reminder has been sent!' : fromNowFilter(reminder.last_sent);
        });
    }],
    link: function(scope, element) {
        // Add the base class to the user card element
        element.addClass('user-card');
    }
  };
});


// fromNow custom filter
angular.module('userCard').filter('fromNow', function() {
  return function(date) {
    return moment(date).fromNow();
  };
});


// The error I keep getting
Unknown provider: fromNowFilterProvider <- fromNowFilter

Answer 1

尝试注入filterprovider并运行您的过滤器.

controller: ['$scope', '$filter', function($scope, $filter) {
       var fromNowFilter = $filter('fromNow');
        angular.forEach($scope.user.reminders, function(reminder) {
            reminder.last_sent = reminder.last_sent === null ? 'No reminder has been sent!' : fromNowFilter(reminder.last_sent);
        });
    }],