2014-11-14 25 views
2

嗨我需要指针来了解如何创建封装角度js过滤器的实用程序模块,以便我可以将输入值(2014-11-14T22:51:04.635Z)传递给格式化并获得格式化(ng-filter:2014年11月14日 - 02:51 PM)输出。目标是利用角度Js过滤器属性独立于前端框架。像胡须这样的框架在HTML中有{{}}标签,这种角度也有,这可能会导致在html文件中直接使用ng-filters时出现问题。所以我试图使用ngFilters而不在html中包含它们。所以我们的目标是接受来自模板的值,使用ngFilters将它们格式化为JS文件并将值推回模板。创建封装角度js特性的实用程序模块

+0

我会写一个JavaScript库,它执行常见任务并将其用于此目的... – harishr 2014-11-22 07:37:49

回答

1

您可以方便地调用$过滤器在JavaScript:

var input = '2014-11-14T22:51:04.635Z'; 
var format = 'd HHH yyyy - h:mm a'; 
var output = $filter('date')(new Date(input), format); 

如果你想改变一个数组,你可以使用.MAP

// You need to get $filter somewhere 
var format = 'd HHH yyyy - h:mm a'; 
var formatDate = $filter('date'); // Save (input.length - 1) function calls 

input = ['2014-11-14T22:51:04.635Z', ...] 
var output = input.map(function(in) { 
    return formatDate(new Date(in), format); 
}); 

要了解更多关于角的date过滤器: https://docs.angularjs.org/api/ng/filter/date

0

我不确定你在做什么是非常值得的。我在想,如果改变角度的开始和结束的符号可以完全解决您的问题,这样你就可以直接使用里面的HTML过滤器:

AngularJS-Twig conflict with double curly braces

有一些情况下,你需要手动调用特定的过滤器在JavaScript。您使用它之前,你可以做到这一点使用$过滤器需要由角注射:

How to use a filter in a controller?

现在我希望你不需要这个还是最好把不正常的角度应用程序使用此,但在极少数情况下,您可能需要在非角度上下文中访问角度功能(如$ filter)。在这种情况下,你可以使用下列元素访问$范围:

var scope = $("path to the DOM element").scope(); 

现在你可以阅读和范围写入范围和更好的通话功能。在这种情况下,你需要把你的过滤器的实例的范围是这样的:

$scope.filterInstance = $filter; 

现在你可以从任何调用此过滤器实例,其中外连角上下文: VAR范围= $(”范围();}。 var result = scope.filterInstance(“xyz”);

1

如果您想在不实际引导AngularJS到您的网络应用程序的情况下访问某些AngularJS功能,您可以创建一个独立的注入器。

var $injector = angular.injector(['ng']); 

然后,您可以从它

$filter = $injector.invoke(['$filter', function ($filter) { return $filter; }]); 

检索$filter服务,并有任何默认AngularJS的过滤器的访问

var formattedDate = $filter('date')(originalDate, format);