Структура Angularjs для визуализации многоразовых данных?

Question

Я хотел бы построить многоразовую диаграмму SVG с Angularjs, и у меня есть ряд вопросов, связанных с директивным контроллером.

В первую очередь я хотел бы быть в состоянии иметь наценку, как это, что делает схему с форменными элементами, которые влияют на внутреннее состояние и, следовательно, визуализации данных:

<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> 

Answer 1

Ответ 1

Вставить контроллер в директиве, если вы не хотите использовать один и тот же контроллер в другой директиве.

Ответ 2

Вы можете создать сервис для хранения контролируемых пользователем атрибуты, которые являются общими для всех графиков.

Ответ 3

Когда есть много параметров, создавая сервис для хранения данных и ввести его в директивы и контроллер будет хорошей идеей.

Общая идея состоит в том, чтобы отделить ваши данные от контроллера и директивы, создав службу.