我正试图找到一种方法来使用角度承诺与d3js ...
我已将代码简化为以下代码段:
d3.select("body")
.append("span")
.text(function (d) {
$translate("SOME_KEY" + d.name).then(function (translation) {
return translation;
});
});
问题在于,.text()
调用在$translate
服务返回promise的结果之前返回。
有人可以为上述问题提供解决方案吗?
P.S。 为了完整性'为此,必须提到$ translate是角度翻译服务,上述代码在ng 1.5组件控制器中运行。
编辑:这是完整的代码:
d3Service.d3().then(function (d3) {
var diameter = 300;
var svg = d3.select($element[0])
.append('svg')
.attr('width', diameter)
.attr('height', diameter);
var bubble = d3.layout.pack()
.size([diameter, diameter])
.value(function (d) {
return d.size;
})
.padding(5);
var nodes = bubble.nodes(ctrl.d3Data)
.filter(function (d) {
return !d.children;
});
var vis = svg
.selectAll('circle')
.data(nodes)
.enter()
.append('g')
.attr('class', 'node')
.attr('transform', function (d) {
return 'translate(' + d.x + ',' + d.y + ')';
});
vis.append('circle')
.attr('r', function (d) {
return d.r;
})
.attr('class', function (d) {
return d.className;
});
vis.append('text')
.text(function (d) {
$translate('DOMAIN_ENUM.CHILDCARE_WORKER_TYPE.' + d.name).then(function (translation) {
return translation;
});
})
.style('text-anchor', 'middle')
.style('font-size', 'small')
.style('fill', 'white');
});