0

我想用 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>
4

1 回答 1

0

答案 1

将控制器嵌入指令中,除非您想在其他指令中重用相同的控制器。

答案 2

您可以创建一个服务来存储在所有图表之间共享的用户控制属性。

答案 3

当有很多参数时,创建一个服务来存储数据并将其注入您的指令和控制器将是一个好主意。

总体思路是通过创建服务将数据与控制器和指令分离。

于 2013-10-08T09:45:39.380 回答