我想用 Angularjs 构建一个可重用的 SVG 图表,并且我有许多与指令控制器相关的问题。
在第一个例子中,我希望能够有这样的标记,它呈现一个带有影响内部状态并因此影响数据可视化的表单元素的图表:
<scatterChart></scatterChart>
=>
<div class="scatterChart">
<div> [Form elements] </div>
<svg>
[Data visualization]
</svg>
</div>
问题 1:控制器、指令、模块
将其构建为具有单独控制器的单个指令是否有意义?或者您会将控制器嵌入指令中,或者创建一个模块?
问题 2:模型/状态到 SVG 渲染
假设图表控制器具有如下内部状态:
scope.model = {
xAxis : "xyz",
yAxis : "abc"
}
模型中的更改应触发图表的重新呈现。在控制器和指令之间共享所有图表用户控制属性的 DRY/正确方式是什么?(同时该指令应该能够具有一些依赖/私有属性。)
问题 3:API
如何将初始状态传递给图表?属性?如果是 20 参数状态呢?
<scatterChart xAxis="abc"></scatterChart>