[英]How to use custom Angular filter inside directive with D3
I have a custom date/time filter I've built called formatDateSimple
. 我有一个自定义的日期/时间过滤器,该过滤器已构建为
formatDateSimple
。 I use this in my Angular templates like so: 我在Angular模板中使用了以下代码:
{{givenDate | formatDateSimple}}
I've also built a custom directive using D3 (a scatterplot). 我还使用D3(散点图)构建了自定义指令。 I want to show the formatted date/time of each 'dot' in my scatterplot while hovering over them.
我想在散点图上显示每个“点”的格式化日期/时间,同时将它们悬停在它们上。
Below is the relevant code found within the link function of my directive: 以下是在我的指令的链接函数中找到的相关代码:
function showTooltip(d) {
var element = d3.selectAll('.transactions.x' + d.id);
angular.element(element).popover({
placement: 'auto top',
container: '#vis',
trigger: 'manual',
html: true,
content: function() {
return '<p>{{' + d.create_date + ' | formatDateSimple}}</p>'
}
});
angular.element(element).popover('show');
This is the result in my tooltip: 这是我的工具提示中的结果:
{{2016-01-01T15:19:07.304Z | formatDateSimple}}
How can I correctly apply this filter? 如何正确应用此过滤器?
Use $filter
in the directive, JavaScript usage is described on every filter page: docs.angularjs.org/api/ng/filter/number . 在指令中使用
$filter
,每个过滤器页面上都描述了JavaScript的用法: docs.angularjs.org/api/ng/filter/number 。
For your example it'd probably be 以您的示例为例
$filter('formatDateSimple')( d.create_date )
Don't forget to require $filter as a dependency. 不要忘记要求$ filter作为依赖项。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.