指令和d3，忽略第一个转换

Question

在一个指令中我试图用d3应用转换（对于html元素，而不是SVG），但奇怪的是它第一次被忽略。

d3.selectAll('h1')
.transition()
.duration(2000)
.style('-webkit-transform',function(d,i){
    return "translateX("+(i*30)+"px)"
})

检查这个jsbin，当它最初渲染时，点击......元素将跳转（没有转换），如果在此之后的任何时候点击 - 过渡按预期工作。

我找不到解决方法的方法

Answer 1

d3需要第一次转换的起点：

template: '<div style="background:red" ng-click="isTrans = !isTrans"><h1 ng-repeat="n in numbers" style="-webkit-transform: translateX(0px)"> {{n}} </h1></div>'

请参阅update。