Как написать настраиваемый фильтр, который возвращается на собственный угловой фильтр

Question

Я бы хотел написать настраиваемый фильтр, который возвращается на собственный угловой фильтр. Например, у меня есть дата с датой NULL, которую я передаю моему представлению в MVC, которую я бы хотел преобразовать в 'MM/dd/yyyy', если он имеет значение, иначе отобразится None.

Html:

<div>{{ myNullableDate | nullableDate }}</div> 

Js:

app.filter('nullableDate', function() { 
    return function(dt) { 
    if (dt) { // dt is something like "/Date(1430341152570)/" 
     var jsonDate = new Date(parseInt(dt.substr(6))); 
     return jsonDate | date:'MM/dd/yyyy'; // <-- This is where I want to use Angular's existing `date:'format'` filter 
    } 

    // date is null, so just return None in italics 
    return "<i>None</i>"; 
    }; 
}); 

Answer 1

См https://docs.angularjs.org/api/ng/filter/date

app.filter('nullableDate', function($filter) { 
    return function(dt) { 
    if (dt) { // dt is something like "/Date(1430341152570)/" 
     return $filter('date')(dt, 'MM/dd/yyyy'); 
    } 

    // date is null, so just return None in italics 
    return "<i>None</i>"; 
    }; 
}); 

Answer 2

Вы можете попытаться вызвать существовавший фильтр, используя $ фильтровальную зависимость:

$filter('existed_filter_name')(arg1,arg2); 

Смотрите соответствующие doc entry.

Answer 3

Вы можете использовать $filter службу для доступа к дате фильтра.

Кроме того, если вы хотите, чтобы результат фильтра появиться как HTML, вы должны использовать ng-bind-html директиву, и возвращает результат с $sce.trustAsHtml (в противном случае вы увидите строку "< \ I> None </\ я> "как выход):

.filter('nullableDate', function($filter, $sce) { 
    return function(dt) { 
    if (dt) { // dt is something like "/Date(1430341152570)/" 
     var jsonDate = new Date(parseInt(dt.substr(6))); 
     var format = $filter('date')(jsonDate,'MM/dd/yyyy'); // <-- This is where I want to use Angular's existing `date:'format'` filter 
     return $sce.trustAsHtml(format); 
    } 

    // date is null, so just return None in italics 
    return $sce.trustAsHtml("<i>None</i>"); 
    }; 
}); 

В вашем HTML:

<div ng-bind-html="myNullableDate | nullableDate"></div>