AngularJs - Use custom filter inside directive controller
21,697
Try inject filterprovider and run your filter.
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);
});
}],
Author by
CupOfJoe
Updated on June 21, 2020Comments
-
CupOfJoe almost 4 years
Scenario
I have an array of users containing information about them, I do anng-repeat
combined with a custom directive that generates an HTML user card, keeping the scope of each card relative to the individual user, inside the user model there is a value that I need to filter with a custom filter before the template gets compiled, because if I do it inside the template the time it takes to be filtered makes the tooltip not to show until the value is ready and that looks as if something is not working.My code so far
// 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